/* ============================================================
   Mobile bottom-tab clearance — guaranteed-fresh standalone file.

   This sits in its own file (separate from tokens.css) because the
   user reported tokens.css edits not taking effect even after hard
   refresh — likely an HTTP/browser cache pinning the old version.
   A brand-new file URL forces a fresh fetch.

   The mobile bottom-tab nav (`<MobileBottomTabs>`) is `position: fixed`
   at the bottom of the viewport and overlays the bottom of any page
   that scrolls inside `.orcanex-frame-content`. Without compensation,
   the last form field / row gets hidden behind the tab strip.

   Three overlapping rules to maximise reliability across browsers:

     1. `padding-bottom` on the LAST direct child of frame-content
        (a block element — not affected by Chromium's flex padding
        bug, https://bugs.chromium.org/p/chromium/issues/detail?id=748518).
     2. `::after` flex spacer on frame-content itself (fallback when
        the page wrapper has `min-height: 100%`).
     3. `padding-bottom` on frame-content itself (works whenever the
        Chromium bug doesn't kick in — block-only page roots).

   The clearance value is:
     60px (tab bar) + safe-area-inset-bottom (iOS home bar) + 16px
     (visual breathing room above the bar). On Chrome dev tools that
     evaluates to 76px; on iOS Safari it'll be 76 + ~34px = 110px.
   ============================================================ */

:root[data-viewport="mobile"]   .orcanex-frame-content > *:last-child,
:root[data-viewport="mobile-l"] .orcanex-frame-content > *:last-child {
    padding-bottom: calc(60px + env(safe-area-inset-bottom, 0px) + 16px) !important;
}

:root[data-viewport="mobile"]   .orcanex-frame-content::after,
:root[data-viewport="mobile-l"] .orcanex-frame-content::after {
    content: "" !important;
    display: block !important;
    flex-shrink: 0 !important;
    height: calc(60px + env(safe-area-inset-bottom, 0px) + 16px) !important;
    width: 100% !important;
}

:root[data-viewport="mobile"]   .orcanex-frame-content,
:root[data-viewport="mobile-l"] .orcanex-frame-content {
    padding-bottom: calc(60px + env(safe-area-inset-bottom, 0px) + 16px) !important;
    scroll-padding-bottom: calc(60px + env(safe-area-inset-bottom, 0px) + 16px) !important;
}
