/*
 * WayzAway Regression Fixes R1B
 */


/* ==========================================================
   GALLERY CLOSE
   Slightly lower within the silver/grey top bar.
========================================================== */

html body .wz-cr12-gallery-close {
  top:
    calc(
      env(safe-area-inset-top, 0px)
      + 8px
    )
    !important;
}


/* ==========================================================
   MOBILE / TABLET
========================================================== */

@media (max-width: 1024px) {

  /*
   * Native Android can report a zero CSS safe-area inset
   * even though the system status bar overlaps the WebView.
   *
   * Keep at least 22px of clear red status-bar space.
   */
  html.wz-native-app {
    --wz-r1b-status-clearance:
      max(
        22px,
        env(
          safe-area-inset-top,
          0px
        )
      );
  }


  /*
   * Extend the red app bar downward.
   */
  html.wz-native-app
    .v-app-bar {
    height:
      calc(
        58px +
        var(
          --wz-r1b-status-clearance
        )
      )
      !important;

    min-height:
      calc(
        58px +
        var(
          --wz-r1b-status-clearance
        )
      )
      !important;
  }


  /*
   * Move the WayzAway logo and account/menu row below
   * the phone/tablet status information.
   */
  html.wz-native-app
    .v-app-bar
    .v-toolbar__content {
    height:
      calc(
        58px +
        var(
          --wz-r1b-status-clearance
        )
      )
      !important;

    min-height:
      calc(
        58px +
        var(
          --wz-r1b-status-clearance
        )
      )
      !important;

    padding-top:
      var(
        --wz-r1b-status-clearance
      )
      !important;

    box-sizing:
      border-box
      !important;
  }


  /*
   * Keep page content below the extended header.
   */
  html.wz-native-app
    .v-main {
    padding-top:
      calc(
        var(
          --v-layout-top,
          58px
        )
        +
        var(
          --wz-r1b-status-clearance
        )
      )
      !important;
  }


  /* ========================================================
     FEATURED EVENT
     Give left date badge and right menu breathing room.
  ======================================================== */

  body.wz-member-wall
    .featured-event
    .wz-canonical-date-badge,
  body.wz-member-wall
    .featured-event
    .wz-group-date-badge,
  body.wz-member-wall
    .featured-event
    [class*="date-badge"] {
    left:
      10px
      !important;

    right:
      auto
      !important;
  }


  body.wz-member-wall
    .featured-event
    button:has(
      .mdi-dots-vertical
    ),
  body.wz-member-wall
    .featured-event
    .v-btn:has(
      .mdi-dots-vertical
    ) {
    position:
      absolute
      !important;

    left:
      auto
      !important;

    right:
      10px
      !important;
  }
}