/* Shared OrcAgent top navbar -- same visual language as /live-market's
   .pt-topbar (colors, fonts, spacing), extended with the extra destinations
   every other page needs (Messages/Notifications with unread badges, and a
   "More" menu for everything that doesn't fit in the primary row). Values
   are hardcoded rather than relying on each host page's own CSS variables
   so this renders identically regardless of what --bg/--accent/etc a given
   page happens to define.
   Pairs with /static/navbar.js. */
.pt-nb-topbar{
  display:flex;align-items:center;gap:18px;
  max-width:1440px;margin:0 auto;padding:10px 16px;
  /* Sticky, not relative: on a long page (a profile, the feed) the navbar
     used to scroll away entirely, so reaching any destination meant
     scrolling all the way back to the top first. It now stays put.
     z-index sits above the menu scrim (190) so the hamburger itself is
     always tappable, including while the menu is open. */
  background:#0a0b0e;position:sticky;top:0;z-index:200;
  font-family:'Geist',system-ui,-apple-system,sans-serif;
}
.pt-nb-topbar *{box-sizing:border-box}
.pt-nb-topbar a{color:inherit;text-decoration:none}
.pt-nb-topbar button{font-family:inherit;cursor:pointer}
.pt-nb-logo{display:flex;align-items:center;gap:9px;flex-shrink:0}
.pt-nb-logo-mark{width:32px;height:32px;border-radius:10px;background:#f7b955;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.pt-nb-logo-mark::before{content:'';width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:11px solid #0a0b0e}
.pt-nb-wordmark{font-size:17px;font-weight:700;letter-spacing:-.02em;color:#eef1f5}
.pt-nb-menu-btn{display:none;align-items:center;justify-content:center;width:34px;height:34px;border-radius:9px;background:#101216;border:1px solid #21252c;color:#eef1f5;font-size:15px;flex-shrink:0}
.pt-nb-nav{display:flex;align-items:center;gap:4px;flex-shrink:0}
/* inline-flex, not flex: these are pills in a horizontal row on desktop and
   must keep sizing to their own content rather than stretching. */
.pt-nb-nav a{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:600;color:#8a919c;padding:8px 13px;border-radius:9px;transition:color .15s,background .15s;white-space:nowrap}
/* The desktop row is tight on width, so the icons come back only once there
   is room for them -- below this the labels alone say enough, and squeezing
   both in would shrink the tap targets that matter more. */
.pt-nb-nav a .pt-nb-ic{display:none}
@media (min-width:1100px){ .pt-nb-nav a .pt-nb-ic{display:block} }
.pt-nb-nav a:hover{color:#eef1f5;background:#16191f}
.pt-nb-nav a.active{color:#f7b955;background:rgba(247,185,85,.12)}
.pt-nb-search-wrap{flex:1;position:relative;max-width:380px;margin-left:4px;min-width:0}
.pt-nb-search{width:100%;background:#101216;border:1px solid #21252c;border-radius:11px;padding:9px 14px 9px 34px;color:#eef1f5;font-size:12.5px;outline:none;transition:border-color .15s}
.pt-nb-search:focus{border-color:#f7b955}
.pt-nb-search::placeholder{color:#565d68}
.pt-nb-search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:#565d68;font-size:13px;pointer-events:none}
.pt-nb-search-close{display:none}
.pt-nb-search-results{position:absolute;top:calc(100% + 6px);left:0;right:0;background:#101216;border:1px solid #21252c;border-top:2px solid #f7b955;border-radius:12px;max-height:340px;overflow-y:auto;z-index:280;display:none;box-shadow:0 16px 40px rgba(0,0,0,.5)}
.pt-nb-search-results.open{display:block}
.pt-nb-sr-hd{padding:8px 12px;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#565d68}
.pt-nb-sr-row{display:flex;align-items:center;gap:10px;padding:8px 12px;cursor:pointer;transition:background .15s}
.pt-nb-sr-row:hover{background:#16191f}
.pt-nb-sr-logo,.pt-nb-sr-logo-ph{width:26px;height:26px;border-radius:8px;flex-shrink:0;object-fit:cover;background:#21252c;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:#8a919c}
.pt-nb-sr-name{flex:1;min-width:0;font-size:12.5px;font-weight:600;color:#eef1f5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pt-nb-sr-sub{font-size:11px;color:#565d68;font-family:'JetBrains Mono',monospace}
.pt-nb-sr-chain{font-size:9px;font-weight:700;color:#9aa3af;background:#20242c;border-radius:4px;padding:1px 5px;margin-left:4px;letter-spacing:.02em;vertical-align:1px}
.pt-nb-sr-empty{padding:16px;text-align:center;color:#565d68;font-size:12px}
@media(max-width:768px){
  #pt-nb-search-portal{position:fixed!important;inset:0!important;width:100vw!important;height:100dvh!important;box-sizing:border-box!important;z-index:5000!important;background:#050b11!important;padding:calc(14px + env(safe-area-inset-top,0px)) 14px calc(14px + env(safe-area-inset-bottom,0px))!important;overflow:hidden!important}
  #pt-nb-search-portal>.pt-nb-search-wrap.mobile-search-open{position:relative!important;inset:auto!important;display:grid!important;grid-template-columns:minmax(0,1fr) 48px!important;grid-template-rows:48px minmax(0,1fr)!important;gap:10px!important;width:100%!important;max-width:none!important;height:100%!important;margin:0!important;padding:0!important;justify-self:stretch!important;transform:none!important;background:transparent!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  #pt-nb-search-portal .pt-nb-search{grid-column:1!important;grid-row:1!important;width:100%!important;height:48px!important;margin:0!important;padding:0 16px 0 42px!important;border-radius:14px!important;color:#eef1f5!important;caret-color:#f7b955!important;background:#0c141d!important}
  #pt-nb-search-portal .pt-nb-search-icon{display:block!important;left:16px!important;top:24px!important;transform:none!important;z-index:2!important}
  #pt-nb-search-portal .pt-nb-search-close{grid-column:2!important;grid-row:1!important;display:flex!important;align-items:center!important;justify-content:center!important;width:48px!important;height:48px!important;margin:0!important;padding:0!important;border:1px solid #25313e!important;border-radius:14px!important;background:#0c141d!important;color:#dce2e9!important;font-size:28px!important}
  #pt-nb-search-portal .pt-nb-search-results{grid-column:1/-1!important;grid-row:2!important;position:relative!important;inset:auto!important;width:100%!important;max-height:none!important;margin:0!important;overflow-y:auto!important}
}
.pt-nb-right{display:flex;align-items:center;gap:8px;margin-left:auto;flex-shrink:0}
.pt-nb-icon-btn{position:relative;display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:10px;background:#101216;border:1px solid #21252c;color:#8a919c;font-size:15px;transition:color .15s,background .15s}
.pt-nb-icon-btn:hover{color:#eef1f5;background:#16191f}
.pt-nb-badge{position:absolute;top:-4px;right:-4px;min-width:16px;height:16px;padding:0 4px;border-radius:999px;background:#f76b62;color:#fff;font-size:9.5px;font-weight:700;font-family:'JetBrains Mono',monospace;display:none;align-items:center;justify-content:center;border:2px solid #0a0b0e;line-height:1}
.pt-nb-badge.show{display:flex}
.pt-nb-sol-chip{display:flex;align-items:center;gap:7px;background:#101216;border:1px solid #21252c;border-radius:11px;padding:7px 13px;font-size:12.5px;font-weight:600;color:#eef1f5;font-family:'Geist',system-ui,sans-serif}
.pt-nb-sol-chip .dot{width:6px;height:6px;border-radius:50%;background:#f7b955}
.pt-nb-sol-num{font-family:'JetBrains Mono',monospace}
/* header-stable-balance.js repurposed this chip from a raw SOL amount into
   the total multi-chain portfolio value (dollar-formatted, e.g. "$20.95").
   The "SOL" unit label that made sense for the old value doesn't for the
   new one -- unhidden on desktop it rendered literally as "$20.95 SOL". */
.pt-nb-sol-unit{display:none}
.pt-nb-avatar{width:34px;height:34px;border-radius:50%;background:#21252c;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#8a919c;flex-shrink:0;object-fit:cover;border:1px solid #21252c;font-family:'JetBrains Mono',monospace}
.pt-nb-profile-link{display:flex;align-items:center;justify-content:center;border-radius:50%}

.pt-nb-more-wrap{position:relative}
.pt-nb-more-dd{display:none;position:absolute;top:calc(100% + 8px);right:0;background:#101216;border:1px solid #21252c;border-radius:13px;padding:6px;min-width:210px;max-height:calc(100vh - 90px);overflow-y:auto;z-index:280;box-shadow:0 16px 40px rgba(0,0,0,.5)}
.pt-nb-more-dd.open{display:block}
/* gap was 6px, set when these rows were text only. Beside a 16px icon that
   reads as no gap at all -- the glyph touches the first letter. 10px matches
   the spacing the primary links use. */
.pt-nb-more-item{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border-radius:9px;font-size:13px;font-weight:600;color:#c7ccd4;background:none;border:none;text-align:left;transition:background .15s,color .15s}
.pt-nb-more-item:hover{background:#16191f;color:#eef1f5}
.pt-nb-more-item .b{margin-left:auto;min-width:16px;height:16px;padding:0 4px;border-radius:999px;background:#f76b62;color:#fff;font-size:9.5px;font-weight:700;font-family:'JetBrains Mono',monospace;display:none;align-items:center;justify-content:center;line-height:1}
.pt-nb-more-item .b.show{display:flex}
.pt-nb-more-sep{height:1px;background:#16191f;margin:6px 4px}

/* ── icons ──
   flex-shrink:0 because a long label must eat its own width, never the
   icon's -- a squashed 14px glyph reads as a rendering fault, and the whole
   point of the icon is that the row is recognisable at a glance.
   stroke-width scales down from the source 2 so a 16px icon does not look
   heavier than the 13px text beside it. */
.pt-nb-ic{width:16px;height:16px;flex:0 0 16px;stroke-width:1.9;opacity:.85}
.pt-nb-more-item:hover .pt-nb-ic,
.pt-nb-more-item.current .pt-nb-ic{opacity:1}
/* The label takes the slack, and truncates rather than wrapping to a second
   line that would make one row taller than its neighbours. */
.pt-nb-more-item > span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Bot is the autonomous trading this product is named for, and it sat
   between History and Live Trades looking exactly like them. A quiet accent
   on the icon only -- enough to be found while scanning, not enough to
   compete with where you actually are. */
.pt-nb-feature .pt-nb-ic{color:#f7b955;opacity:1}
.pt-nb-more-item.danger{color:#f76b62}
.pt-nb-more-item.danger:hover{background:rgba(247,107,98,.1)}
.pt-nb-admin-link{color:#f7b955;font-weight:700}
.pt-nb-admin-link:hover{background:rgba(247,185,85,.1);color:#f7b955}

.pt-nb-scrim{display:none;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:190}
.pt-nb-scrim.show{display:block}

/* On mobile, everything from the "More" popup is folded straight into the
   hamburger's own dropdown (#pt-nb-nav) -- one menu instead of two separate
   ones (hamburger for the primary 5, a separate "..." for the rest). Hidden
   here by default (desktop: #pt-nb-nav is the inline pill row, this content
   would look like a stray list bolted onto it); shown below only inside the
   mobile breakpoint, where #pt-nb-nav becomes a dropdown panel anyway.

   Scoped to #pt-nb-nav (an id, not just the .pt-nb-mobile-only class) on
   purpose: a bare `.pt-nb-mobile-only{display:none}` has specificity (0,1,0),
   and every one of these <a> items is ALSO matched by `.pt-nb-nav a{display:
   inline-flex}` at (0,1,1) -- one more type selector, which beats an equal
   class count regardless of source order. That rule silently won on every
   desktop browser: ten "mobile-only" links (Traders, Groups, Promote,
   History, Bot, ...) rendered inline in the primary row all the time,
   pushing the nav more than 700px past a 1440px viewport -- and with it the
   search bar, the balance chip and the avatar, off the right edge of the
   screen entirely. The id lifts this rule to (1,1,0), which beats (0,1,1)
   outright, the same way it already correctly did for the plain <button>
   and <div> items in this same list (no `.pt-nb-nav button`/`.pt-nb-nav div`
   rule exists to out-specify them, so they were never affected). */
#pt-nb-nav .pt-nb-mobile-only{display:none}

@media (max-width: 900px){
  /* Stays sticky here too. This used to be position:relative purely so the
     dropdown below could anchor to it -- but sticky establishes a containing
     block for absolutely-positioned children just as well, and relative meant
     the navbar scrolled away on exactly the long pages where reaching it
     matters most. */
  .pt-nb-topbar{flex-wrap:wrap;gap:10px;padding:8px 10px;position:sticky;top:0}
  .pt-nb-menu-btn{display:flex}
  /* Two columns, so the whole menu fits on one screen instead of being a
     scrolling list of 15 full-width rows. The five main destinations keep a
     full-width row each (they are the ones people reach for); everything
     secondary pairs up. Grid rather than flex specifically so a row can span
     both columns without wrapping the markup in extra containers. */
  .pt-nb-nav{display:none;grid-template-columns:1fr 1fr;align-items:stretch;gap:2px 6px;position:absolute;top:52px;left:10px;right:10px;max-height:calc(100dvh - 72px);overflow-y:auto;background:#101216;border:1px solid #21252c;border-radius:14px;padding:8px;z-index:210;box-shadow:0 16px 40px rgba(0,0,0,.55)}
  .pt-nb-nav.mobile-open{display:grid}
  .pt-nb-nav > a:not(.pt-nb-more-item){grid-column:1/-1;padding:11px 13px;text-align:left;font-size:14px;
    display:flex;align-items:center;gap:9px}
  .pt-nb-nav > a:not(.pt-nb-more-item) .pt-nb-ic{display:block;width:18px;height:18px;flex:0 0 18px}
  .pt-nb-nav > .pt-nb-more-item{grid-column:auto}
  /* Disconnect is destructive -- it gets its own full-width row rather than
     sitting half-width beside an ordinary destination. */
  .pt-nb-nav > .pt-nb-more-item.danger{grid-column:1/-1}
  .pt-nb-search-wrap{order:5;flex-basis:100%;max-width:none;margin-left:0}
  .pt-nb-search{font-size:16px}
  /* .pt-nb-sol-unit is hidden unconditionally now (see the base rule) --
     removed here to avoid two rules quietly agreeing by coincidence. */
  /* The separate "More" (⋮) button is now redundant -- its destinations are
     merged into the hamburger menu above. */
  .pt-nb-more-wrap{display:none}
  /* Matches the base rule's specificity (see its comment) so this override actually wins at this breakpoint -- a bare .pt-nb-mobile-only{display:block} here ties the base rule's OLD (0,1,0) and would have needed to, but now loses outright to the base rule's (1,1,0) once that was raised to beat .pt-nb-nav a. */
  #pt-nb-nav .pt-nb-mobile-only{display:block}
  .pt-nb-nav-sep,.pt-nb-nav .pt-nb-more-sep{grid-column:1/-1;height:1px;background:#1c2027;margin:5px 4px}
  /* display and gap are stated here too rather than left to the base rule.
     This override already restates almost every other property, so leaving
     two of them inherited is a trap: it reads as if the row's layout is
     defined here, and it is not. The label's own span does the truncating --
     doing it on the flex container clipped the icon instead. */
  .pt-nb-nav .pt-nb-more-item{display:flex;align-items:center;gap:10px;width:100%;text-align:left;font-size:13px;padding:11px 12px;min-height:44px;color:#8a919c;background:none;border:none;font-family:inherit;cursor:pointer;border-radius:9px;transition:background .15s,color .15s}
  .pt-nb-nav .pt-nb-more-item:hover{background:#16191f;color:#eef1f5}
  /* Where you actually are, in the merged mobile menu. Marked from the real
     path (see navbar.js) rather than only for the five primary links, so a
     secondary page like Bot or Referrals says so too. */
  .pt-nb-nav > .pt-nb-more-item.current{color:#f7b955;background:rgba(247,185,85,.12)}
  .pt-nb-nav .pt-nb-more-item.danger{color:#f76b62}
  .pt-nb-nav .pt-nb-more-item.danger:hover{background:rgba(247,107,98,.1)}
  .pt-nb-nav .pt-nb-more-item.pt-nb-admin-link{color:#f7b955;font-weight:700}
  .pt-nb-nav .pt-nb-more-item.pt-nb-admin-link:hover{background:rgba(247,185,85,.1);color:#f7b955}
}
@media (max-width: 480px){
  .pt-nb-wordmark{display:none}
}
