/* =========================================================================
   restore-fixes.css

   Presentation fixes applied on top of the restored site, 9 September 2026.
   Nothing here is from the original: it is loaded last, as its own file, so
   every archived stylesheet stays byte-for-byte as it was served. Delete the
   one <link> in the pages to get the untouched original back.

   Each block says what was wrong and how it was measured.
   ========================================================================= */

/* -------------------------------------------------------------------------
   1. Desktop dropdowns were 122px wide.

   Every label of more than one word wrapped onto two lines: "Residential
   Loans", "Refinancing Your Home Loan", "Investment Property Loans" and nine
   others. Give the panel room and stop the labels breaking.
   ---------------------------------------------------------------------- */
@media (min-width: 1025px) {
  .jkit-menu ul.sub-menu {
    min-width: 260px !important;
    width: auto !important;
  }

  .jkit-menu ul.sub-menu > li > a {
    white-space: nowrap !important;
  }
}

/* -------------------------------------------------------------------------
   2. The Loans dropdown ran off the bottom of the screen.

   Fifteen items, 776px tall, opening at y=110. It only fitted on a viewport
   at least ~890px high. On a 1366x768 laptop the last items sat 118px below
   the fold with no way to reach them, and on 1440x800 by 86px.

   Cap it to the space actually available and let it scroll. The 132px
   allows for the header above it plus a little breathing room at the base.
   ---------------------------------------------------------------------- */
@media (min-width: 1025px) {
  .jkit-menu > li > ul.sub-menu {
    max-height: calc(100vh - 132px) !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
  }

  /* A quiet scrollbar, so the fix does not announce itself. */
  .jkit-menu > li > ul.sub-menu {
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 0, 0, 0.25) transparent;
  }
  .jkit-menu > li > ul.sub-menu::-webkit-scrollbar {
    width: 8px;
  }
  .jkit-menu > li > ul.sub-menu::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.22);
    border-radius: 4px;
  }
  .jkit-menu > li > ul.sub-menu::-webkit-scrollbar-track {
    background: transparent;
  }
}

/* -------------------------------------------------------------------------
   3. Keep the right-hand dropdowns on screen.

   Widening them in rule 1 pushes the last items in the bar towards the edge,
   so the final two open to the left of their parent instead of the right.
   ---------------------------------------------------------------------- */
@media (min-width: 1025px) {
  .jkit-menu > li:nth-last-child(-n + 2) > ul.sub-menu {
    left: auto !important;
    right: 0 !important;
  }
}

/* -------------------------------------------------------------------------
   4. The phone menu panel opened with a 260px logo.

   The logo rendered at its natural 205px height inside the slide-in panel,
   pushing the first menu item to y=280 and leaving a large dead gap above
   it. The header uses the same image at about 80px, so match that.
   ---------------------------------------------------------------------- */
@media (max-width: 1024px) {
  .jkit-nav-identity-panel {
    padding-top: 6px !important;
  }

  .jkit-nav-identity-panel .jkit-nav-site-title,
  .jkit-nav-identity-panel .jkit-nav-logo {
    height: auto !important;
    padding-top: 0 !important;
  }

  .jkit-nav-identity-panel .jkit-nav-logo img {
    max-height: 64px !important;
    width: auto !important;
    height: auto !important;
  }

  /* The list then starts just under the logo rather than a third of the way
     down the screen. */
  .jkit-menu-wrapper.active .jkit-menu-container {
    margin-top: 0 !important;
  }

  /* A long menu with its submenus open must be able to scroll. */
  .jkit-menu-wrapper.active {
    overflow-y: auto !important;
    overscroll-behavior: contain;
  }
}

/* -------------------------------------------------------------------------
   5. Touch targets on the phone.

   Menu rows were 21px tall. Anything tapped with a thumb wants nearer 44px,
   which is the size Apple and Google both publish.
   ---------------------------------------------------------------------- */
@media (max-width: 1024px) {
  .jkit-menu-wrapper.active .jkit-menu > li > a,
  .jkit-menu-wrapper.active .jkit-menu ul.sub-menu > li > a {
    min-height: 44px;
    display: flex !important;
    align-items: center;
  }
}

/* -------------------------------------------------------------------------
   6. Nothing may scroll the page sideways.

   A belt-and-braces guard. The restored pages measured clean at 390, 768 and
   1440, but one oversized element anywhere would otherwise let the whole
   document slide.
   ---------------------------------------------------------------------- */
html,
body {
  overflow-x: hidden;
  max-width: 100%;
}

img,
video,
iframe {
  max-width: 100%;
}