/* ══════════════════════════════════════════════════════════════════════════
   Site-wide default zoom — 90%.

   The whole site used to render at the browser's 100%, which packed less on
   screen than intended (a laptop showed ~9 sidebar rows where a desktop showed
   14). Setting the browser to 90% by hand fixed it; this makes that the
   default so nobody has to.

   WHY THE COMPENSATION BLOCK BELOW EXISTS
   `zoom` scales every length EXCEPT the viewport units. Inside a zoomed root,
   `100vh` still resolves against the unzoomed viewport and is then scaled with
   everything else — so a shell asking for `height:100vh` renders at 90% of the
   window and leaves a dead strip along the bottom (measured: 900px → 810px on
   the chat shell). Anything that must fill the VISUAL viewport therefore has
   to ask for `100vh / var(--vzoom)` instead.

   Only full-viewport SHELLS need this. A `max-height: calc(100vh - 64px)` on a
   popover is a ceiling, not a fill, and 10% less ceiling reads as normal.

   To change the zoom, or to turn it off, edit --vzoom in one place below.
   ══════════════════════════════════════════════════════════════════════════ */

:root {
    --vzoom: 0.9;
    /* The full visual viewport height, expressed in the zoomed coordinate
       space. Use this anywhere `100vh` meant "fill the window". */
    --vzoom-vh: calc(100vh / 0.9);
}

html {
    zoom: var(--vzoom);
}

/* ── Full-viewport shells ──────────────────────────────────────────────────
   Each of these fills the window and would otherwise end 10% short. The
   subtracted pixels stay as they are: they are already in the zoomed space. */

/* Chat (public/assets/user/css/vai-chat.css). Desktop only: on phones the
   shell is pinned to window.innerHeight by JS in chat.blade.php, which does
   its own division — an !important here would out-rank that inline style and
   put back the very dead strip the lock exists to remove. */
@media (min-width: 992px) {
    .vai { height: var(--vzoom-vh) !important; }
}

/* Market — Freelancer / Property / Games / Templates
   (resources/views/user/market/layout.blade.php), minus the dashboard navbar.
   The subtracted pixels stay as they are: already in the zoomed space. */
.vai-mkt { height: calc(var(--vzoom-vh) - 62px) !important; }

/* Framed freelancer pages inside the dashboard
   (resources/views/user/market/embed.blade.php). */
.vai-frame { height: calc(var(--vzoom-vh) - 62px) !important; }

/* Bootstrap's viewport utilities, used by hero sections across the public
   site and by the sub-apps. */
.vh-100 { height: var(--vzoom-vh) !important; }
.min-vh-100 { min-height: var(--vzoom-vh) !important; }

@media (max-width: 991px) {
    .vai-mkt,
    .vai-frame { height: calc(var(--vzoom-vh) - 56px) !important; }
}
