/* Family Book — keep authenticated mobile pages visually solid edge-to-edge.
   This does not change page layout or card spacing; it only removes mismatched
   shell/body gutters that can show beside full-width profile and directory views. */

:root{
  --fb-solid-page-bg:#fbf8f2;
}

html[data-theme="dark"]{
  --fb-solid-page-bg:#111512;
}

@media (max-width:899px){
  html,
  body,
  .app,
  #screen{
    background:var(--fb-solid-page-bg)!important;
  }

  html,
  body,
  #app,
  .app,
  #screen{
    width:100%;
    max-width:100%;
    overflow-x:clip!important;
  }

  .app{
    min-height:100dvh;
  }

  #screen{
    min-height:calc(100dvh - 104px);
    box-sizing:border-box;
  }

  /* Profile pages use transparent sections, so keep the route base itself solid. */
  .member-profile-view:not(.history-profile-view):not(.account-profile-view){
    background:var(--fb-solid-page-bg)!important;
  }

  /* Match Chromium's visible scrollbar track/gutter to the page background. */
  body::-webkit-scrollbar-track{
    background:var(--fb-solid-page-bg);
  }
}

/* Android Chrome: 100vw can include the scrollbar gutter and make the profile
   a few pixels wider than the visible page. The profile wrapper is already
   full-bleed on mobile, so its children should use that width instead. */
@media (max-width:759px){
  .member-profile-view:not(.history-profile-view):not(.account-profile-view){
    max-width:none!important;
    overflow-x:clip!important;
  }

  .member-profile-view:not(.history-profile-view):not(.account-profile-view) .fb-member-profile,
  .member-profile-view:not(.history-profile-view):not(.account-profile-view) .fb-profile-content,
  .member-profile-view:not(.history-profile-view):not(.account-profile-view) .fb-profile-actions{
    max-width:100%!important;
    box-sizing:border-box!important;
  }

  .member-profile-view:not(.history-profile-view):not(.account-profile-view) .fb-basic-cover{
    width:100%!important;
    max-width:100%!important;
    margin-left:0!important;
    margin-right:0!important;
    box-sizing:border-box!important;
  }

  .member-profile-view:not(.history-profile-view):not(.account-profile-view)>.fb-member-profile-header{
    width:100%!important;
    max-width:100%!important;
    margin-left:0!important;
    margin-right:0!important;
    box-sizing:border-box!important;
  }
}
