
/* ============================================================
   BOOM TRAINER OS
   HOME MOBILE V1
   ============================================================ */

@media (max-width: 760px) {

  /* ----------------------------------------------------------
     HERO
     ---------------------------------------------------------- */

  .trainer-home {
    width: 100% !important;
    overflow: hidden;
  }

  .trainer-hero--home-v7 {
    width:
      calc(100% - 20px) !important;

    min-height: 0 !important;

    margin:
      14px auto 22px !important;

    padding:
      24px 18px 26px !important;

    display: flex !important;
    flex-direction: column !important;

    align-items: center !important;

    gap: 0 !important;

    border-radius:
      22px !important;

    overflow:
      hidden !important;
  }


  /* old desktop telemetry */
  .trainer-hero--home-v7
  > .trainer-hero__telemetry {
    display: none !important;
  }


  /* ----------------------------------------------------------
     TRAINER IDENTITY
     ---------------------------------------------------------- */

  .trainer-hero--home-v7
  > .trainer-hero__identity {
    order: 1 !important;

    position: relative !important;
    inset: auto !important;

    width: 100% !important;

    margin: 0 !important;

    transform: none !important;

    text-align:
      center !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }


  .trainer-hero__identity
  .portal-kicker {
    text-align:
      center !important;
  }


  .trainer-hero__location {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    gap: 9px !important;

    width: 100% !important;

    text-align: center !important;
  }


  .trainer-hero__identity h1 {
    width: 100% !important;

    margin:
      14px 0 6px !important;

    font-size:
      clamp(2.05rem, 10vw, 3rem) !important;

    line-height:
      .98 !important;

    text-align:
      center !important;

    overflow-wrap:
      anywhere;
  }


  .trainer-hero__identity h1 small {
    display: block !important;

    margin-bottom:
      9px !important;

    font-size:
      .42em !important;

    text-align:
      center !important;
  }


  .trainer-hero__designation {
    text-align:
      center !important;
  }


  .trainer-hero__promise {
    max-width:
      310px !important;

    margin:
      12px auto 0 !important;

    text-align:
      center !important;

    line-height:
      1.45 !important;
  }


  /* ----------------------------------------------------------
     ACTIVE PARTY
     ---------------------------------------------------------- */

  .trainer-hero--home-v7
  > .trainer-hero__party--home-v7 {
    order: 2 !important;

    position: relative !important;

    inset: auto !important;

    width: 100% !important;
    max-width: 340px !important;

    margin:
      22px auto 0 !important;

    transform:
      none !important;
  }


  .trainer-hero__party-title {
    display: block !important;

    width: 100% !important;

    margin-bottom:
      10px !important;

    text-align:
      center !important;

    font-size:
      .65rem !important;

    letter-spacing:
      .13em !important;
  }


  .trainer-hero--home-v7
  .trainer-hero__party--home-v7
  ol {
    display: grid !important;

    grid-template-columns:
      repeat(3, 72px) !important;

    justify-content:
      center !important;

    gap:
      12px 20px !important;

    width: 100% !important;

    margin: 0 auto !important;
    padding: 0 !important;
  }


  .trainer-hero--home-v7
  .trainer-hero__party--home-v7
  ol > li {
    position: relative !important;

    width: 72px !important;
    height: 72px !important;

    min-width: 72px !important;
    min-height: 72px !important;

    margin: 0 !important;
    padding: 5px !important;

    display: flex !important;

    align-items:
      center !important;

    justify-content:
      center !important;

    overflow:
      hidden !important;

    border-radius:
      14px !important;
  }


  /*
   * På mobilen ska party-rutan endast visa Pokémon.
   */
  .trainer-hero--home-v7
  .trainer-hero__party--home-v7
  ol > li > :not(img) {
    display: none !important;
  }


  .trainer-hero--home-v7
  .trainer-hero__party--home-v7
  ol > li::before,

  .trainer-hero--home-v7
  .trainer-hero__party--home-v7
  ol > li::after {
    content: none !important;
    display: none !important;
  }


  .trainer-hero--home-v7
  .trainer-hero__party--home-v7
  ol > li img {
    position: static !important;

    inset: auto !important;

    display: block !important;

    width: 62px !important;
    height: 62px !important;

    min-width: 62px !important;
    min-height: 62px !important;

    max-width: 62px !important;
    max-height: 62px !important;

    margin: auto !important;

    object-fit:
      contain !important;

    object-position:
      center center !important;

    transform:
      none !important;
  }


  /* ----------------------------------------------------------
     BIG PARTNER POKEMON
     ---------------------------------------------------------- */

  .trainer-hero--home-v7
  > .trainer-hero__pokemon--home-v7 {
    order: 3 !important;

    position: relative !important;

    inset: auto !important;

    width: 100% !important;

    min-height:
      310px !important;

    margin:
      16px auto 0 !important;

    padding: 0 !important;

    display: flex !important;

    align-items:
      center !important;

    justify-content:
      center !important;

    transform:
      none !important;

    overflow:
      visible !important;
  }


  .trainer-hero__pokemon--home-v7
  .trainer-hero__orbit {
    left: 50% !important;
    right: auto !important;

    top: 50% !important;

    transform:
      translate(-50%, -50%) !important;
  }


  /*
   * JS sätter denna klass på själva stora Pokémonbilden.
   */
  .trainer-hero__pokemon--home-v7
  .home-mobile-featured-art {
    position: relative !important;

    inset: auto !important;

    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;

    display: block !important;

    width:
      min(290px, 76vw) !important;

    height:
      min(290px, 76vw) !important;

    max-width:
      290px !important;

    max-height:
      290px !important;

    margin:
      0 auto !important;

    object-fit:
      contain !important;

    object-position:
      center center !important;

    transform:
      none !important;

    z-index:
      3 !important;
  }


  /*
   * Textkortet under stora Entei tas bort på mobil.
   * Bara själva Pokémonen ska synas.
   */
  .home-mobile-hide-partner-copy {
    display: none !important;
  }


  /* ----------------------------------------------------------
     NEXT DESTINATION
     ---------------------------------------------------------- */

  .trainer-hero--home-v7
  > .trainer-hero__command {
    order: 4 !important;

    position: relative !important;

    inset: auto !important;

    width: 100% !important;

    margin:
      8px auto 0 !important;

    transform:
      none !important;

    text-align:
      center !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }


  .trainer-hero__continue {
    display: block !important;

    width: 100% !important;

    margin-bottom:
      8px !important;

    text-align:
      center !important;
  }


  .trainer-hero--home-v7
  .portal-world-action {
    position: relative !important;

    inset: auto !important;

    width: 100% !important;
    max-width: 340px !important;

    min-height:
      105px !important;

    margin:
      0 auto !important;

    padding:
      18px 20px !important;

    transform:
      none !important;

    text-align:
      center !important;
  }


  .trainer-hero--home-v7
  .portal-world-action b,

  .trainer-hero--home-v7
  .portal-world-action span {
    text-align:
      center !important;
  }


  /* ----------------------------------------------------------
     ADVENTURE HUB HEADER
     ---------------------------------------------------------- */

  .boom-adventure-hub {
    width:
      calc(100% - 20px) !important;

    margin:
      0 auto !important;

    padding-bottom:
      95px !important;
  }


  .boom-adventure-heading {
    display: flex !important;
    flex-direction: column !important;

    align-items:
      center !important;

    justify-content:
      center !important;

    text-align:
      center !important;

    gap:
      10px !important;
  }


  .boom-adventure-heading
  > div:first-child {
    width: 100% !important;

    text-align:
      center !important;
  }


  .boom-adventure-eyebrow {
    display: block !important;

    text-align:
      center !important;
  }


  .boom-adventure-heading h2 {
    width: 100% !important;

    margin:
      5px auto 5px !important;

    font-size:
      clamp(2.05rem, 11vw, 3rem) !important;

    line-height:
      .94 !important;

    text-align:
      center !important;

    overflow-wrap:
      normal !important;
  }


  .boom-adventure-heading p {
    max-width:
      320px !important;

    margin:
      0 auto !important;

    text-align:
      center !important;
  }


  .boom-adventure-region {
    margin:
      10px auto 0 !important;

    text-align:
      center !important;
  }

}

