/* Shared top bar (app/site-header.php) — used by the app and the v2 pages. IDs keep it
   independent of app.css / bootstrap / v2.css rules for .tabs, .btn and links. */
#ar-top{position:sticky;top:0;z-index:45;background:var(--navy,#0D3A5C);color:#fff;font:15px/1.4 -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;box-sizing:border-box}
#ar-top *{box-sizing:border-box}
#ar-top .v2-top-inner{position:relative;display:flex;align-items:center;gap:14px;max-width:1180px;margin:0 auto;padding:10px 24px;min-height:58px}
#ar-top .v2-brand{display:flex;align-items:center;gap:9px;text-decoration:none;margin:0;flex:none}
#ar-top .v2-mark{height:28px;width:auto;opacity:.6}#ar-top .v2-word{height:15px;width:auto}
/* The nav also carries class "tabs" (the classic app uses it to highlight the current view).
   v2.css styles .tabs as an in-page tab bar with a bottom border, so reset those here. */
#ar-top .v2-nav{display:flex;flex-direction:row;gap:2px;margin:0 0 0 10px;border-bottom:0;overflow:visible}
/* Hide the search form's submit button visually (still there for screen readers / Enter key).
   Defined here because v2 pages don't load the stylesheets that normally define .sr-only. */
#ar-top .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
#ar-top .v2-nav a{display:block;color:#d7e3ee;padding:7px 11px;border:0;border-radius:8px;font-size:14px;line-height:1.3;background:none;text-decoration:none;white-space:nowrap}
#ar-top .v2-nav a:hover{background:rgba(255,255,255,.08);color:#fff}
#ar-top .v2-nav a.active{background:var(--teal,#0E9A78);color:#fff;box-shadow:none;border-color:transparent}
#ar-top .v2-count{display:inline-block;margin-left:5px;padding:1px 6px;border-radius:999px;background:rgba(255,255,255,.18);font-size:11px;font-weight:600;line-height:1.5}
#ar-top .v2-nav a.active .v2-count{background:rgba(255,255,255,.28)}
#ar-top .v2-search{display:flex;align-items:center;gap:8px;margin:0 0 0 auto;flex:0 1 300px;min-width:140px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:7px 14px;max-width:none;height:auto}
#ar-top .v2-search:focus-within{background:var(--card,#fff);border-color:#fff}
#ar-top .v2-search svg{width:16px;height:16px;flex:none;fill:none;stroke:#b9cddd;stroke-width:1.8;stroke-linecap:round}
#ar-top .v2-search:focus-within svg{stroke:var(--muted,#7a8698)}
#ar-top .v2-search input{flex:1;min-width:0;width:100%;border:0;outline:0;background:none;color:#fff;font-size:14px;padding:0;height:auto;box-shadow:none}
#ar-top .v2-search input::placeholder{color:#a9c0d2;opacity:1}
#ar-top .v2-search:focus-within input{color:var(--ink,#14263a)}
#ar-top .v2-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;color:#d7e3ee;flex:none;text-decoration:none;background:none;border:0}
#ar-top .v2-icon:hover{background:rgba(255,255,255,.1);color:#fff}
#ar-top .v2-icon svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
#ar-top .ar-search-icon{display:none}
#ar-top .v2-me{display:block;margin:0;padding:0;width:34px;height:34px;border-radius:50%;overflow:hidden;border:2px solid rgba(255,255,255,.35);background:var(--blue,#1D5E96);cursor:pointer;flex:none}
#ar-top .v2-me img{display:block;width:100%;height:100%;object-fit:cover}
#ar-top .v2-me.open{border-color:#fff}
#ar-top .ar-signin{margin-left:auto;background:var(--card,#fff);color:var(--navy,#0D3A5C);border:0;border-radius:999px;padding:8px 16px;font-size:14px;font-weight:600;text-decoration:none}
#ar-top .v2-burger{display:none;margin:0;width:40px;height:40px;border:0;background:none;border-radius:10px;cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:5px;flex:none;padding:0}
#ar-top .v2-burger span{display:block;width:22px;height:2px;border-radius:2px;background:var(--card,#fff);transition:transform .2s,opacity .2s}
#ar-top .v2-burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}#ar-top .v2-burger.open span:nth-child(2){opacity:0}#ar-top .v2-burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
#ar-top .v2-menu{position:absolute;top:calc(100% + 6px);right:16px;left:auto;width:250px;z-index:50;background:var(--card,#fff);border-radius:16px;box-shadow:0 18px 50px rgba(10,20,32,.28);padding:8px;display:grid;gap:0}
#ar-top .v2-menu[hidden]{display:none!important}
#ar-top .v2-menu a,#ar-top .v2-menu button{display:block;width:100%;text-align:left;padding:11px 14px;border:0;border-radius:10px;background:none;color:var(--ink,#14263a);font:500 15px/1.3 inherit;font-family:inherit;text-decoration:none;cursor:pointer}
#ar-top .v2-menu a:hover,#ar-top .v2-menu button:hover{background:var(--paper,#f6f4ef);color:var(--ink,#14263a)}
#ar-top .v2-menu .ar-signout{color:#b43b2f;border-top:1px solid var(--line-2,#efece5);border-radius:0 0 10px 10px;margin-top:4px}
#ar-top .ar-menu-main{display:none}
#ar-top .v2-menu [hidden]{display:none!important}
/* signed in / out */
#ar-top:not(.signed-in) .ar-in{display:none!important}
#ar-top.signed-in .ar-out{display:none!important}
#ar-top:not(.signed-in) .v2-burger{display:flex}
@media(max-width:980px){#ar-top .v2-search{flex-basis:200px}}
@media(max-width:820px){
 #ar-top .v2-top-inner{padding:8px 12px;gap:6px;min-height:54px}
 #ar-top .v2-nav,#ar-top .v2-search,#ar-top .v2-me{display:none!important}
 #ar-top .ar-search-icon{display:grid;margin-left:auto}
 #ar-top .v2-burger{display:flex}
 #ar-top .v2-word{height:13px}
 #ar-top .ar-signin{padding:7px 12px;font-size:13px}
 #ar-top .v2-menu{position:fixed;top:60px;left:10px;right:10px;width:auto}
 #ar-top .v2-menu a,#ar-top .v2-menu button{font-size:16px;padding:13px 16px}
 #ar-top .ar-menu-main{display:grid;border-bottom:1px solid var(--line-2,#efece5);padding-bottom:4px;margin-bottom:4px}
}
@media(max-width:380px){#ar-top .v2-mark{display:none}}
#ar-top .v2-menu:not([hidden]){display:grid!important}

/* Keep the top bar pinned while scrolling. The pages hide sideways scrolling with
   overflow-x:hidden on html/body, which quietly stops position:sticky from working;
   "clip" hides the same overflow without that side effect. */
@supports (overflow: clip) {
  html, body, html[data-theme], html[data-theme] body { overflow-x: clip; }
}

/* The site is light-only for now. This (plus the color-scheme meta tag in each page's <head>)
   tells phone browsers with an automatic "dark mode for websites" to leave the colors alone. */
:root { color-scheme: only light; }
/* Unseen notifications number on the bell */
#ar-top .v2-icon{position:relative}
#ar-top .bell-count{position:absolute;top:1px;right:0;min-width:17px;height:17px;padding:0 4px;border-radius:999px;background:var(--coral,#EF6A5B);color:#fff;font:700 10px/17px -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;text-align:center;box-shadow:0 0 0 2px var(--navy,#0D3A5C)}

.v2-search-go{display:grid;place-items:center;border:0;background:none;padding:0;margin:0;cursor:pointer;flex:none;line-height:0}
