/* ============================================================================
   2011-catalog-scrollbar.css — AGENT 2 (pass 2), OWNER DEFECT #2 ONLY.

     "when there's no scrollbar eg. when all the content in the catalog isn't
      expanded, it's still keeping a gap for the scrollbar even though it's not
      there. habbo doesn't do that, it just lets it grow."

   WHAT WAS ACTUALLY WRONG
   -----------------------
   The previous pass already hid the idle bar with `visibility: hidden`, so it
   was invisible — but it still measured 20x336 and, worse, the tree itself was
   pinned at 141px wide by

       .nitro-catalog-navigation-list.nitro-catalog-navigation-list{width:141px}

   in 2011-catalog-nav.css. 141 = 158 - 17, i.e. the list was permanently
   dodging a bar that was not painted. That 17px strip is the gap the owner
   sees. Measured live before this file (10 categories, nothing expanded):

       navigation-viewport   158 wide, scrollHeight 336  (does NOT overflow)
       navigation-list       141 wide                     <-- 17px dead gutter
       navigation-scrollbar   20 wide, visibility:hidden  <-- still measurable

   WHY GROWING TO 158 IS THE 2011 BEHAVIOUR, NOT AN INVENTION
   ----------------------------------------------------------
   The `catalog` layout declares

       itemlist_vertical  navigationList          0,1  158x336
       scrollbar_vertical navigationListScrollbar 141,1  20x336

   The list is the FULL width of its 159px container and the bar OVERLAPS its
   right end (141..161). Flash reserves nothing: the bar is painted on top when
   the target overflows and is absent when it does not. Contrast the item grid,
   where `itemGrid` and `itemGridScrollbar` are declared side by side and the
   17px column IS spec-reserved — that one must keep its gap, and this file
   deliberately does not touch it.

   BOTH STATES, measured after this file (see the report):
     idle       bar 0x336 (still in the DOM, still at its spec x), list 158
     scrollable bar 20x336 at abs 494,40 exactly as the spec says, list 141

   `width: 0`, deliberately NOT `display: none`: layout_verify.js must still
   find and measure the element. maps/catalog.json now carries
   `collapsedWhen` on navigationListScrollbar so the verifier accepts a
   zero-width box in the idle state and still demands the full 20x336 box at
   494,40 whenever the bar is live. Nothing about the geometry pass is relaxed.

   Loaded AFTER 2011-catalog-nav.css and 2011-catalog-sidebar.css (both of
   which set the 141px width and the visibility rule) and BEFORE
   2011-catalog-art.css, which must stay last.
   ============================================================================ */

/* ---- 1. the idle bar occupies nothing ---------------------------------- */

#root .nitro-catalog-window .nitro-catalog-navigation-scrollbar.is-idle.is-idle {
    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;
    overflow: hidden !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

/* Its art too — the buttons/track/thumb are 17px each and would otherwise
   still report as reserved space (and would paint outside a 0px parent if the
   overflow clip above were ever lost). */
#root .nitro-catalog-window .nitro-catalog-navigation-scrollbar.is-idle.is-idle .nitro-catalog-navigation-scrollbar-button,
#root .nitro-catalog-window .nitro-catalog-navigation-scrollbar.is-idle.is-idle .nitro-catalog-navigation-scrollbar-track,
#root .nitro-catalog-window .nitro-catalog-navigation-scrollbar.is-idle.is-idle .nitro-catalog-navigation-scrollbar-thumb {
    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;
    background-image: none !important;
}

/* ---- 2. ...so the tree grows into the space -----------------------------
   :has() scopes this to the idle state only; the moment the bar becomes
   `is-scrollable` the rule stops matching and nav.css's 141px is back, which
   is what keeps the rows clear of the live bar. */

#root .nitro-catalog-window .nitro-catalog-navigation-shell:has(> .nitro-catalog-navigation-scrollbar.is-idle) .nitro-catalog-navigation-list.nitro-catalog-navigation-list {
    width: 158px !important;
}

/* ---- 3. ...but the EXPANDER COLUMN does not move ------------------------
   Measured off preview/reference-2011-shop.png, which is itself an idle tree
   (ten categories, no bar):

       row white span            x 416..551   -> row right edge 551
       "Habbe Vip" branch arrow  x 516..520   -> 31px in from that edge

   31px of inset on a row that has NO scrollbar beside it. If 2011 had simply
   re-flowed the arrow to the new right edge it would sit ~9px in, like every
   other right-aligned glyph. It does not: the background grows and the glyph
   column stays where it was. So the expander gets back exactly the 17px the
   bar used to occupy, which puts the triangle on the same x in both states.

   (Our arrow still lands ~5px right of the reference's. That residual is the
   expander's own 6px margin in 2011-catalog-sidebar.css section 3 — it is off
   by the same 5px in the scrollable state too, i.e. it predates this file and
   belongs to whoever owns the row metrics.) */

#root .nitro-catalog-window .nitro-catalog-navigation-shell:has(> .nitro-catalog-navigation-scrollbar.is-idle) .nitro-catalog-navigation-item .nitro-catalog-navigation-expander {
    margin-right: 23px !important; /* 6 as usual + the 17 the bar gave back */
}