/* ════════ ARENA — FOCUSED CHROME ════════════════════════════════════════════════════════════════
   The owner, on the ARENA screen beside the design reference: «ليش هذا موجود» — why is the old top
   strip still there. It is the platform's global header, and the reference has no second bar above
   the section: the competition's own rail is the masthead, and the only controls the design keeps
   are language, colour mode and fullscreen.

   Inside ARENA ONLY:
     · the global price TICKER is removed — a competitor reading a ranked field has no use for a
       scrolling XAU strip, and its 1Hz repaint is a distraction beside a live mark,
     · the header keeps exactly THREE controls — language · colour mode · fullscreen,
     · MARKET STATUS / NEXT SESSION leaves with it: those are the trading floor's hours, and an
       ARENA edition runs on its OWN schedule (`starts_at` / `trading_ends_at`), which the rail
       already states. Two clocks on one screen, answering different questions, is the ambiguity
       this section exists to avoid,
     · the page TITLE leaves the topbar, because the section carries its own masthead.

   EVERY rule is gated on body[data-view="arena"], set by shell.js for the active view, so it can
   only ever affect this one section. Loaded globally from index.html rather than lazily, so it
   applies the instant the attribute flips — a lazily-loaded rule would show the ticker for one
   frame on first entry. Restoration is automatic: leaving flips data-view away, every rule below
   stops matching, and the full header returns with no reload and no state to unwind.

   The same proven shape as rvil-chrome.css · news-chrome.css · academy-chrome.css ·
   profile-chrome.css · spin-chrome.css. Nothing here is ARENA-specific except the attribute value
   and the one glass rule at the end. ──── */

/* ── 1 · the global price ticker ── */
html:not(.wco-on) body[data-view="arena"] .ticker{display:none}
html.wco-on       body[data-view="arena"] .ticker{display:none}   /* installed PWA: still hidden, but .app keeps its window-controls-overlay offset */

/* reclaim the 34px the fixed ticker reserved, so the section sits at the very top.
   Gated on :not(.wco-on) because in the installed PWA that padding is the OS titlebar's. */
html:not(.wco-on) body[data-view="arena"] .app{padding-top:0}
html:not(.wco-on) body[data-view="arena"] .side{top:0}
html:not(.wco-on) body[data-view="arena"] .topbar{top:0}
html:not(.wco-on) body[data-view="arena"] .sidetog{top:19px}

/* ── 2 · the strip has nothing left to carry, so it goes ──
   The specification puts colour mode, language and fullscreen in ARENA's OWN tab row (§3.11), and
   the section renders them there. Leaving the shell's copies in a bar above would be the same three
   controls twice, which is what the owner is looking at when he says the old strip is still there.
   So every control goes, and with the title, the market hours and the ticker already gone the bar
   is empty — an empty bar is not neutral, it reads as chrome whose contents failed to load.

   CHARTS IS THE PRECEDENT, not an invention: `base.css` records that it is "the one view with NO
   topbar to centre against (measured height 0)". ARENA becomes the second.

   .burger is the ONE thing that survives, below 901px, because it is the phone's navigation and
   removing it would strand a reader inside the section — so the bar itself is hidden on desktop
   only, where `.sidetog` (which is not in the bar) is the navigation control. */
body[data-view="arena"] .hdr-status,
body[data-view="arena"] #btnSearch,
body[data-view="arena"] #btnBell,
body[data-view="arena"] #btnMail,
body[data-view="arena"] #btnMore,
body[data-view="arena"] #userChip,
body[data-view="arena"] #themeBtn,
body[data-view="arena"] #btnLang,
body[data-view="arena"] #btnFs{display:none!important}

/* the page title moves into the section's own masthead — one title per page, not two */
body[data-view="arena"] .topbar .hdrL{display:none}

@media (min-width:901px){
  body[data-view="arena"] .topbar{display:none}
}
/* below 901px the bar stays for the burger alone, and takes the height of nothing else */
@media (max-width:900px){
  body[data-view="arena"] .topbar{block-size:auto; padding-block:8px;}
}

/* ── 3 · the high-impact news banner must not sit on the section's navigation ──
   `#intelBanner` is a product-wide alert: fixed at the top, z-index 1500. On every other view it
   floats over the 66px topbar; here the topbar is gone, so it covered the TAB ROW — measured on a
   real instance, a click on «Competitions» hit the banner instead. The banner keeps its place and
   the section starts below it while it is showing. */
@supports selector(:has(*)) {
  html:not(.wco-on) body[data-view="arena"]:has(#intelBanner.on) .app{ padding-block-start:62px; }
  html:not(.wco-on) body[data-view="arena"]:has(#intelBanner.on) .sidetog{ inset-block-start:70px; }
}