/* ===========================================================================
   TechCA global layout — sticky footer.

   Keeps the footer at the bottom of the viewport on short pages and after the
   content on long pages, without position:fixed and without overlapping the
   sidebar (the footer lives inside .page-wrapper, which is offset from the
   absolute .left-sidebar by its left margin).

   Notes:
   - .header (topbar) is position:relative and 60px tall, so #main-wrapper only
     needs to fill the rest of the viewport (100vh flat would add a scrollbar
     under the in-flow header).
   - The theme's custom.min.js sets an inline min-height on .page-wrapper on load;
     min-height:0 !important neutralises it so the flex sizing wins.
   - Scoped to #main-wrapper / .page-wrapper, which exist only on logged-in
     module pages — the auth screens use their own layout and are untouched.
   =========================================================================== */

#main-wrapper{
    min-height:calc(100vh - 59px); /* header is now position:fixed, 59px tall; body has a matching padding-top */
    display:flex;
    flex-direction:column;
}

/* Every .page-wrapper becomes a flex column so a direct-child .footer with
   margin-top:auto lands at the bottom — including the ~30 legacy form pages
   (rpq, profile_kyc, inbound/outbound, ...) that have no #main-wrapper.
   min-height is !important because the theme's custom.min.js stamps an inline
   min-height on .page-wrapper that is often shorter than the viewport, which
   left the footer floating mid-page. */
.page-wrapper{
    display:flex !important;
    flex-direction:column !important;
    min-height:calc(100vh - 59px) !important;
    padding-bottom:0 !important;   /* was 60px, which left a gap under the footer */
}

#main-wrapper > .page-wrapper{
    flex:1 1 auto !important;      /* main content area grows to fill the space */
    min-height:0 !important;       /* override the theme JS inline min-height; #main-wrapper provides the height */
}

/* The theme sets .footer{position:absolute}. Inside the flex column above, an
   absolutely-positioned child with no top value takes its static position at the
   TOP of the column — so the footer rendered at the top of the page. Force it back
   into normal flow so margin-top:auto pins it to the bottom instead. */
.page-wrapper .footer,
.page-wrapper .tcserv-foot,
.page-wrapper .tc-dash-footer{
    position:static !important;
    left:auto !important;
    right:auto !important;
    bottom:auto !important;
    margin-top:auto !important;
    margin-bottom:0 !important;   /* style.css gives .footer a 16px bottom margin that left a gap under the footer */
}

/* Most module pages carry their own <style> block ending in something like
       .page-wrapper .footer{ ... margin-top:22px !important; }
   That selector has exactly the same specificity as the rule above and, being in an
   inline <style> after this file, wins on source order — which unpinned the footer on
   ~200 pages and left it floating part-way down. Repeating the pin at a higher
   specificity settles it once for every page, including any added later that copies the
   same skin. */
html body .page-wrapper .footer,
html body .page-wrapper .tcserv-foot,
html body .page-wrapper .tc-dash-footer{
    position:static !important;
    margin-top:auto !important;
    margin-bottom:0 !important;
}
/* margin-top:auto collapses to 0 once the content is taller than the viewport, so on long
   pages the last card would butt against the bar. A transparent top border clipped out of
   the background keeps an 18px gap that takes whatever colour the page itself uses -
   pages vary between #eef2f8, #f1f4fa and #f4f6fa, so a fixed colour would seam. */
html body .page-wrapper > .footer,
html body .page-wrapper > .tcserv-foot,
html body .page-wrapper > .tc-dash-footer{
    border-top:18px solid transparent !important;
    background-clip:padding-box !important;
}

/* the absolute sidebar starts at the viewport top and runs under the fixed 59px
   header — pad it so its first item clears the header (was 60px for the old bar). */
.left-sidebar{padding-top:66px !important;}