/* Shared Services mobile gutters. Desktop layout and component styling remain unchanged. */
@media (max-width: 991.98px) {
  .container {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    padding-left: 16px !important;
    padding-right: 16px !important;
    padding-left: max(16px, env(safe-area-inset-left, 0px)) !important;
    padding-right: max(16px, env(safe-area-inset-right, 0px)) !important;
  }

  /* The navbar already has its own outer padding: avoid adding the gutter twice. */
  #nav.navbar {
    padding-left: 16px;
    padding-right: 16px;
    padding-left: max(16px, env(safe-area-inset-left, 0px));
    padding-right: max(16px, env(safe-area-inset-right, 0px));
  }
  #nav.navbar > .container {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* APP sections that use custom full-width wrappers instead of .container. */
  .appdl .app-info__inner,
  .appdl .app-track {
    padding-left: 16px !important;
    padding-right: 16px !important;
    padding-left: max(16px, env(safe-area-inset-left, 0px)) !important;
    padding-right: max(16px, env(safe-area-inset-right, 0px)) !important;
  }
  .appdl .app-track { scroll-padding-left: 16px; scroll-padding-right: 16px; }

  /* Only FAQ list question titles; the page heading and detail titles retain their sizes. */
  .fqa-main .fqa-row__q {
    font-size: 16px;
    line-height: 1.5;
  }
}
