/* ──────────────────────────────────────────────────────────────────────────
   THE BYAR ZIP — the zipper down the page, as a placeable premium item.

   This is the platform front door's own zip, lifted out of
   resources/views/marketing/home.blade.php so a tenant can have the SAME one
   rather than a copy that drifts. The rules for `middle` below are the
   original `.zipwrap` rules to the pixel — 160px wide, full height, z-index
   from the surface, and on a narrow screen it steps to the left margin at
   120px — because the platform page renders through this file now and must
   look exactly as it did.

   FOUR POSITIONS, the owner's own list: middle, left, right, or both edges.
   `edges` is two mounts (data-pos="edge-l" and "edge-r"), and the right one
   stands down under 920px: two 120px zips on a phone leave no page between
   them.

   The layer never takes a click (pointer-events:none the whole way down) and
   is aria-hidden in the markup.
   ────────────────────────────────────────────────────────────────────────── */

.bzr {
    position: fixed;
    top: 0;
    height: 100vh;
    width: 160px;
    /* The surface decides: the platform home puts its own content at
       z-index 2 and has always expected the zip at 1; a tenant page does not
       position its content at all, so there the zip goes behind it. */
    z-index: var(--bzr-z, 1);
    pointer-events: none;
}

.bzr canvas {
    width: 100%;
    height: 100%;
    display: block;
}

.bzr[data-pos="middle"] { left: 50%; transform: translateX(-50%); }
.bzr[data-pos="left"]   { left: 20px; }
.bzr[data-pos="right"]  { right: 20px; }
.bzr[data-pos="edge-l"] { left: 8px; }
.bzr[data-pos="edge-r"] { right: 8px; }

@media (max-width: 920px) {
    .bzr { width: 120px; }
    /* The original behaviour, kept: a centred zip steps aside on a narrow
       screen rather than running down the middle of the words. */
    .bzr[data-pos="middle"] { left: 20px; transform: none; }
    .bzr[data-pos="edge-r"] { display: none; }
}

@media print {
    .bzr { display: none !important; }
}