/**
 * @file
 * Generic Gin + core-navigation mobile fixes.
 *
 * Stock Gin is barely usable at phone widths: the top bar keeps its 80px
 * desktop sidebar gutter, the breadcrumb trail wraps over multiple lines
 * pushing Save off-screen, the navigation drawer's footer (user/profile menu)
 * sits below the fold of a very tall menu, and several visually-hidden helpers
 * and off-screen form sidebars create page-wide horizontal scroll.
 *
 * NOTE: !important is required because module CSS loads before theme CSS.
 */

@media (max-width: 768px) {
  /* No page-level horizontal scroll: off-screen Gin form sidebars and hidden
     shortcut helpers otherwise widen the scrollable area by ~140px. */
  html,
  body {
    overflow-x: hidden !important;
  }

  /* Visually-hidden "Add to shortcuts" helper overflows the viewport. */
  .shortcut-action__message {
    display: none !important;
  }

  /* Top bar: keep only the "Back to site" escape link, drop the rest of the
     breadcrumb trail so actions (Save) stay on one row inside the viewport. */
  .top-bar .gin-breadcrumb__item:not(:first-child) {
    display: none !important;
  }

  .top-bar__actions {
    flex-shrink: 0 !important;
  }

  /* Local actions + Save get their own full-width row of the top-bar grid,
     under "Back to site", and wrap there instead of stacking one per line in
     the narrow right column (#1156: 3 webform actions + Save/Reset made a
     ~210px top bar). */
  .top-bar__actions {
    grid-column: 1 / -1 !important;
    justify-content: flex-start !important;
  }

  /* Gin reserves 80px left padding for the desktop sidebar toggle; on mobile
     that is a dead gap before "Back to site" and wraps the link. */
  .top-bar {
    padding-left: 16px !important;
  }

  .gin-breadcrumb__link,
  .gin-breadcrumb__text {
    white-space: nowrap !important;
  }

  /* Views listing tables scroll inside their own container instead of
     stretching the page. */
  .views-form,
  .views-element-container {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  /* Exposed filter widgets stay inside the viewport (e.g. /admin/people Role/
     Permission selects were clipped at the right edge). */
  .views-exposed-form .js-form-item,
  .views-exposed-form .form-select {
    max-width: calc(100vw - 32px) !important;
  }

  /* Horizontal tabs on entity forms: scroll the tab strip, don't overflow. */
  ul.horizontal-tabs-list {
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
  }
}

/* Drawer mode (core navigation ≤1023px): pin the footer (user/profile menu)
   to the bottom of the scrolling drawer so the profile entry is always
   reachable instead of sitting below the fold of a very tall menu. */
@media (max-width: 1023px) {
  aside.admin-toolbar .admin-toolbar__footer {
    position: sticky !important;
    bottom: 0 !important;
    background: var(--admin-toolbar-color-surface, #fff) !important;
    z-index: 10 !important;
  }
}
