/* ═══════════════════════════════════════════════════════════════════════════
   nv-handoff.css — v31.341b (owner — PRODUCTION FIX)
   THE HANDHELD SAVE / SHARE SHEET, for every page that can show a document.
   ═══════════════════════════════════════════════════════════════════════════
   *"on mobile the document covers the whole screen and users are forced to
   restart the application ... have the download open something else, e.g save
   to file, save to dropbox, share etc instead of covering the page."*

   ⚠⚠⚠ ITS OWN FILE, AND SELF-SUFFICIENT. Invoice Print and the other
   shell-less pages load neither tokens.css nor app.css, so nothing here may
   lean on them: every colour carries its own fallback and the buttons are
   styled here rather than borrowing `.btn`. Inside the shell the tokens win;
   outside it the fallbacks are the same values.

   ⚠⚠⚠ A BOTTOM SHEET, NOT A SCREEN. The page the reader came from stays
   visible behind a scrim they can tap to leave — a home-screen app has no back
   button, so a sheet that replaced the page would be the defect again.

   ⚠⚠ z-index 39 — over the shell's viewer (37) and under its dialogs (40/41).
   ⚠⚠ OWN CLASSNAMES (.nvhh*): `.nvdoc` is already claimed twice in app.css. */
html.nvhh-lock { overflow: hidden; }

.nvhh {
    position: fixed;
    inset: 0;
    z-index: 39;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    font-family: inherit;
}
    .nvhh[hidden] { display: none; }

.nvhh-scrim {
    position: absolute;
    inset: 0;
    background: rgba(3, 6, 14, .58);
}

.nvhh-sheet {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 10px 18px 18px;
    /* ⚠ the home indicator on an iPhone sits over the bottom 34px */
    padding-bottom: max(18px, calc(env(safe-area-inset-bottom) + 12px));
    background: linear-gradient(180deg, #0f1830 0%, #0b1020 100%);
    border-top: 1px solid rgba(232,167,92,.28);
    border-radius: 16px 16px 0 0;
    box-shadow: 0 -12px 34px rgba(0,0,0,.45);
    color: var(--nv-ink, #f1f3f9);
}

.nvhh-grip {
    align-self: center;
    width: 38px;
    height: 4px;
    border-radius: 2px;
    background: rgba(255,255,255,.22);
}

.nvhh-head {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.nvhh-ic {
    flex: 0 0 auto;
    display: inline-flex;
    color: var(--nv-gold, #e8a75c);
}

.nvhh-nm {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 15px;
    color: var(--nv-ink, #f1f3f9);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nvhh-say {
    margin: 0;
    font-size: 13px;
    line-height: 1.4;
    color: var(--nv-ink-2, #aab3c8);
}
    .nvhh-say.nvhh-bad { color: var(--nv-red, #e0707a); }

/* ⚠⚠ FULL-WIDTH, THUMB-HEIGHT BUTTONS, stacked. This sheet only exists on a
   phone, so every control is sized for a finger and nothing sits side by side
   where a miss lands on the neighbour. */
.nvhh-acts {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.nvhh-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    min-height: 46px;
    padding: 10px 16px;
    border-radius: 10px;
    font: inherit;
    font-size: 16px;
    font-weight: 300;
    letter-spacing: .01em;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    color: #fff;
    background: linear-gradient(90deg, #0b3d73 0%, #1f78c8 100%);
    border: 1.5px solid rgba(232,167,92,.85);
}
    .nvhh-btn[hidden] { display: none; }
    .nvhh-btn:focus-visible { outline: 2px solid #e8a75c; outline-offset: 2px; }
    .nvhh-btn[disabled] { opacity: .55; cursor: default; }

.nvhh-sec {
    color: var(--nv-ink-2, #c9d1e3);
    background: rgba(255,255,255,.03);
    border: 1px solid rgba(120,150,210,.35);
}

/* ═══════════════════════════════════════════════════════════════════════════
   v31.523 — THE PDF READER (owner, mixed bag item 2)
   ═══════════════════════════════════════════════════════════════════════════
   *"Email attachment and document attached to invoices etc does not have a
   view in 01-Screen and 02-Screen if the document is pdf ... This is a major
   requirement for users to view pdf documents on 01-Screen and 02-Screen."*

   ⚠⚠⚠ A CANVAS, AND A CLOSE BUTTON THAT IS NEVER OFF SCREEN. The reader does
   cover the sheet — a page of A4 on a phone has nowhere else to go — so the
   bar carrying Close is pinned at the top and never scrolls away with the
   page. That is the difference between this and the fault of v31.341: there
   the document took the window and left no way back, because a home-screen
   app has no address bar and no back button.

   ⚠⚠ NOTHING HERE NAVIGATES. No iframe, no anchor, no plugin viewer with its
   own ↗ and ⤓. The bytes are the blob the sheet already fetched, so the
   reader costs no second request either.

   ⚠ SELF-SUFFICIENT like the rest of this file: Invoice Print and the other
   shell-less pages load no tokens, so every colour carries its fallback. */
.nvhh-pdf {
    position: absolute;
    inset: 0;
    z-index: 2;                            /* over the sheet it is drawn after */
    display: flex;
    flex-direction: column;
    background: #0b1020;
}
    .nvhh-pdf[hidden] { display: none; }

.nvhh-pdfbar {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    /* ⚠ six controls on a 390px bar: nothing may wrap onto a second line, or
       Close leaves the top of the panel and the way out stops being obvious. */
    flex-wrap: nowrap;
    gap: 5px;
    padding: 8px 8px;
    /* ⚠ the notch on an iPhone sits over the top of a full-height panel */
    padding-top: max(8px, calc(env(safe-area-inset-top) + 4px));
    background: linear-gradient(180deg, #0f1830 0%, #0b1020 100%);
    border-bottom: 1px solid rgba(232,167,92,.28);
}

.nvhh-pspacer { flex: 1 1 auto; }

.nvhh-pbtn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    /* ⚠ 44px — a finger, not a mouse. This panel exists only on a phone. */
    flex: 0 0 auto;
    min-width: 44px;
    min-height: 44px;
    padding: 0 6px;
    border-radius: 9px;
    font: inherit;
    font-size: 20px;
    font-weight: 300;
    line-height: 1;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    color: var(--nv-ink-2, #c9d1e3);
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(120,150,210,.35);
}
    .nvhh-pbtn:focus-visible { outline: 2px solid #e8a75c; outline-offset: 2px; }
    .nvhh-pbtn[disabled] { opacity: .4; cursor: default; }

.nvhh-pclose {
    padding: 0 12px;
    font-size: 15px;
    color: #fff;
    background: linear-gradient(90deg, #0b3d73 0%, #1f78c8 100%);
    border: 1.5px solid rgba(232,167,92,.85);
}

.nvhh-pnum {
    /* ⚠ it SHRINKS. On the narrowest screen the page count gives way before a
       button does — a number that ellipsises is a nuisance, a Close pushed off
       the bar is the v31.341 trap again. */
    flex: 0 1 auto;
    min-width: 0;
    padding: 0 2px;
    text-align: center;
    white-space: nowrap;
    font-size: 13px;
    font-weight: 300;
    letter-spacing: .02em;
    color: var(--nv-ink-2, #aab3c8);
}

/* ⚠ the ONLY scroller in the reader, and it scrolls the page down, not the
   application sideways — HR-1 holds because the canvas is cut to the stage. */
.nvhh-pstage {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding: 4px;
    padding-bottom: max(4px, calc(env(safe-area-inset-bottom) + 4px));
}
    /*  ══ v31.539 — ONE OF OUR OWN PAGES ON THE SAME STAGE ═════════════════
        ⚠⚠ WHITE BEHIND IT, for the reason the canvas rule below gives: a report
        is paper, and a transparent page draws its ink onto the dark sheet.
        ⚠ IT FILLS THE STAGE rather than sizing to its content — an iframe has
        no content-based height, so without this it collapses to the 150px
        default every browser gives it and the report shows two lines. */
    .nvhh-pstage .nvhh-pframe {
        display: block;
        flex: 1 1 auto;
        width: 100%;
        height: 100%;
        border: 0;
        background: #fff;
    }

    .nvhh-pstage:has(> .nvhh-pframe:not([hidden])) {
        /*  the frame is the whole stage, so it is not centred like a page */
        display: block;
        padding: 0;
    }

    .nvhh-pstage canvas {
        display: block;
        max-width: 100%;
        /* ⚠ a PDF page is paper. White behind it, or a transparent page draws
           its ink onto the dark sheet and the text disappears. */
        background: #fff;
        border-radius: 4px;
        box-shadow: 0 6px 18px rgba(0,0,0,.45);
    }

/*  ══ v31.541 (owner - THE BLIND SPOT) ══════════════════════════════════════
    *"There is a blind spot on the page rendered as shown in the image."*

    ⚠⚠⚠⚠ THE GUARD BELOW IS NOT NEW. `app.css` HAS CARRIED IT SINCE v19.7,
    WORD FOR WORD, PUT THERE AS *"toolkit lesson, third strike"*. What it never
    reached is THIS FILE - and this file is loaded INSTEAD OF app.css by the
    only pages that have no shell (`Financials/Customers/InvoicePrint`,
    `Reports/Print`). So the one guard that has protected every other screen in
    the application for twenty versions was missing from exactly the surfaces
    that load their CSS alone, and nothing anywhere said so.

    ⚠⚠⚠ WHAT IT COST. The reader swaps its two surfaces by the `hidden`
    property alone - canvas for a PDF, frame for one of our own pages - and
    `.nvhh-pstage canvas` and `.nvhh-pframe` each set `display`, which outranks
    the BROWSER's own `[hidden] { display: none }`. So since v31.539 the
    surface being put away stayed on the stage; and the stage is `display:flex`,
    so it did not merely sit there - it took a share of the row:

      · reading a PDF, the empty frame stood BESIDE the page as a white
        rectangle and shoved the page off the left edge - measured at v31.540
        as a 382px page at x -146 in a 390px stage. That white block, and the
        dark gap left under the shortened page, is what the owner circled.
      · reading a report, the undrawn canvas did the same at its 300x150
        default.

    ⚠⚠ AND IT IS WHY NO PROBE SAW IT. Every reader arm but quick540's drives a
    page that HAS the shell, where app.css's copy of this guard was quietly
    doing the work. The defect only ever existed where the probes were not.

    ⚠⚠⚠ THE STANDING RULE (HR-9, now in the toolkit): A STYLESHEET WRITTEN TO
    STAND ALONE MUST CARRY app.css's GUARDS, NOT ONLY ITS COLOURS. This file's
    own header already promises self-sufficiency for colour. The promise was
    half kept. */
[hidden] {
    display: none !important;
}