/*
 * Pokémon Next mobile P1 layer.
 * Loaded after pokemon-next-v1.css so every rule is removable as one file.
 * Geometry is driven by MobileViewportController and falls back to dvh.
 */

@media (max-width: 760px) {
  html[data-ui-revision="pokemon-next"] {
    --pk-mobile-hit: 44px;
    --pk-mobile-vv-height: 100dvh;
    --pk-mobile-vv-width: 100vw;
    --pk-mobile-vv-offset-top: 0px;
    --pk-mobile-vv-offset-right: 0px;
    --pk-mobile-vv-offset-bottom: 0px;
    --pk-mobile-vv-offset-left: 0px;
    --pk-mobile-keyboard-inset: 0px;
    --pk-mobile-chat-reserve: calc(92px + var(--pk-safe-bottom));
  }

  html[data-ui-revision="pokemon-next"][data-mobile-keyboard="open"] {
    --pk-mobile-chat-reserve: max(8px, var(--pk-safe-bottom));
  }

  /* Chat follows the visible viewport instead of the layout viewport/OSK. */
  html[data-ui-revision="pokemon-next"] .game-screen #chatPanel.chat-panel.chat-messenger {
    top: calc(var(--pk-mobile-vv-offset-top) + max(8px, var(--pk-safe-top))) !important;
    right: calc(var(--pk-mobile-vv-offset-right) + max(8px, var(--pk-safe-right))) !important;
    bottom: calc(var(--pk-mobile-vv-offset-bottom) + var(--pk-mobile-chat-reserve)) !important;
    left: calc(var(--pk-mobile-vv-offset-left) + max(8px, var(--pk-safe-left))) !important;
    grid-template-rows: 58px 56px minmax(0, 1fr) !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overscroll-behavior: contain;
  }

  html[data-ui-revision="pokemon-next"][data-mobile-keyboard="open"] .game-screen .mobile-dock {
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  html[data-ui-revision="pokemon-next"] .game-screen #chatPanel > .chat-emoji-panel {
    right: 7px !important;
    bottom: 72px !important;
    left: 7px !important;
    grid-template-rows: minmax(52px, auto) 54px minmax(0, 1fr) !important;
    width: auto !important;
    height: min(44%, 320px) !important;
    min-height: 0 !important;
    max-height: calc(100% - 80px) !important;
    overflow: hidden !important;
  }

  html[data-ui-revision="pokemon-next"][data-mobile-keyboard="open"] .game-screen #chatPanel > .chat-emoji-panel {
    height: min(38%, 220px) !important;
  }

  html[data-ui-revision="pokemon-next"] .game-screen #chatPanel .chat-media-head {
    grid-template-columns: minmax(0, 1fr) auto !important;
    min-height: 52px !important;
    gap: 6px !important;
  }

  html[data-ui-revision="pokemon-next"] .game-screen #chatPanel > .chat-emoji-panel > .chat-emoji-category-rail {
    grid-template-columns: var(--pk-mobile-hit) minmax(0, 1fr) var(--pk-mobile-hit) !important;
    height: 54px !important;
    padding: 5px 4px !important;
  }

  html[data-ui-revision="pokemon-next"] .game-screen #chatPanel .chat-emoji-category-rail .chat-emoji-categories {
    height: var(--pk-mobile-hit) !important;
  }

  html[data-ui-revision="pokemon-next"] .game-screen #chatPanel .chat-head-actions > button,
  html[data-ui-revision="pokemon-next"] .game-screen #chatPanel .chat-head-search > button,
  html[data-ui-revision="pokemon-next"] .game-screen #chatPanel .chat-private-head > button,
  html[data-ui-revision="pokemon-next"] .game-screen #chatPanel .chat-reply-preview > button,
  html[data-ui-revision="pokemon-next"] .game-screen #chatPanel .chat-emoji-rail-button,
  html[data-ui-revision="pokemon-next"] .game-screen #chatPanel .chat-message-more,
  html[data-ui-revision="pokemon-next"] .game-screen #chatPanel #chatForm > button {
    width: var(--pk-mobile-hit) !important;
    height: var(--pk-mobile-hit) !important;
    min-width: var(--pk-mobile-hit) !important;
    min-height: var(--pk-mobile-hit) !important;
  }

  html[data-ui-revision="pokemon-next"] .game-screen #chatPanel > .chat-tabs > button,
  html[data-ui-revision="pokemon-next"] .game-screen #chatPanel .chat-media-tabs > button,
  html[data-ui-revision="pokemon-next"] .game-screen #chatPanel .chat-popover-actions > button,
  html[data-ui-revision="pokemon-next"] .game-screen #chatPanel .chat-pack-locked > button,
  html[data-ui-revision="pokemon-next"] .game-screen #chatPanel .chat-jump-latest {
    min-height: var(--pk-mobile-hit) !important;
  }

  html[data-ui-revision="pokemon-next"] .game-screen #chatPanel > .chat-tabs {
    padding-block: 5px !important;
  }

  html[data-ui-revision="pokemon-next"] .game-screen #chatPanel .chat-emoji-category-rail .chat-emoji-categories > button {
    min-width: var(--pk-mobile-hit) !important;
    height: var(--pk-mobile-hit) !important;
    min-height: var(--pk-mobile-hit) !important;
  }

  html[data-ui-revision="pokemon-next"] .game-screen #chatPanel .chat-emoji-grid > button:not(.chat-sticker-button) {
    min-width: 0 !important;
    height: var(--pk-mobile-hit) !important;
    min-height: var(--pk-mobile-hit) !important;
  }

  html[data-ui-revision="pokemon-next"] .game-screen #chatPanel .chat-message:not(.is-notice) {
    grid-template-columns: 34px minmax(0, 1fr) var(--pk-mobile-hit) !important;
  }

  html[data-ui-revision="pokemon-next"] .game-screen #chatPanel :is(#chatInput, #chatSearchInput) {
    font-size: 16px !important;
  }

  /* Starter selection: the parent owns insets; the card no longer overflows them. */
  html[data-ui-revision="pokemon-next"] .starter-dialog.is-open {
    inset:
      var(--pk-mobile-vv-offset-top)
      var(--pk-mobile-vv-offset-right)
      var(--pk-mobile-vv-offset-bottom)
      var(--pk-mobile-vv-offset-left) !important;
    padding:
      max(6px, var(--pk-safe-top))
      max(6px, var(--pk-safe-right))
      max(6px, var(--pk-safe-bottom))
      max(6px, var(--pk-safe-left)) !important;
  }

  html[data-ui-revision="pokemon-next"] .starter-experience {
    width: 100% !important;
    max-height: calc(
      var(--pk-mobile-vv-height) - max(6px, var(--pk-safe-top)) - max(6px, var(--pk-safe-bottom))
    ) !important;
    margin: 0 !important;
  }

  html[data-ui-revision="pokemon-next"] .starter-flow-content {
    max-height: calc(
      var(--pk-mobile-vv-height) - max(6px, var(--pk-safe-top)) - max(6px, var(--pk-safe-bottom)) - 58px
    ) !important;
  }

  html[data-ui-revision="pokemon-next"] .starter-experience button {
    min-width: var(--pk-mobile-hit);
    min-height: var(--pk-mobile-hit);
    touch-action: manipulation;
  }

  /* Geodude Quarry is injected later, so important declarations keep this P1 layer authoritative. */
  html[data-ui-revision="pokemon-next"] body > .quarry {
    inset:
      var(--pk-mobile-vv-offset-top)
      var(--pk-mobile-vv-offset-right)
      var(--pk-mobile-vv-offset-bottom)
      var(--pk-mobile-vv-offset-left) !important;
    box-sizing: border-box !important;
    padding:
      max(6px, var(--pk-safe-top))
      max(6px, var(--pk-safe-right))
      max(6px, var(--pk-safe-bottom))
      max(6px, var(--pk-safe-left)) !important;
  }

  html[data-ui-revision="pokemon-next"] body > .quarry .quarry-window {
    max-height: 100% !important;
  }

  html[data-ui-revision="pokemon-next"] body > .quarry[data-view="game"] .quarry-window {
    height: 100% !important;
  }

  html[data-ui-revision="pokemon-next"] body > .quarry .quarry-grid {
    --tile: max(
      44px,
      min(
        68px,
        calc((var(--pk-mobile-vv-height) - 304px) / 6),
        calc((100vw - var(--pk-safe-left) - var(--pk-safe-right) - 60px) / 5)
      )
    ) !important;
  }

  html[data-ui-revision="pokemon-next"] body > .quarry[data-view="game"] .quarry-header {
    height: auto !important;
  }

  html[data-ui-revision="pokemon-next"] body > .quarry :is(
    .quarry-header button,
    .quarry-hud button,
    .quarry-tools > button,
    .quarry-combinations > button,
    .quarry-legend > button,
    .quarry-overlay button,
    .quarry-footer button,
    .quarry-round button
  ) {
    min-width: var(--pk-mobile-hit) !important;
    min-height: var(--pk-mobile-hit) !important;
    touch-action: manipulation;
  }

  html[data-ui-revision="pokemon-next"] body > .quarry .quarry-header button {
    width: var(--pk-mobile-hit) !important;
    height: var(--pk-mobile-hit) !important;
  }

  html[data-ui-revision="pokemon-next"] body > .quarry .quarry-tools > .quarry-help {
    min-width: var(--pk-mobile-hit) !important;
  }

  /* Pidgey Flight: preserve the full Pokémon scene inside notches and rounded corners. */
  html[data-ui-revision="pokemon-next"] .lab-games[data-game-mode="flight"] {
    inset:
      var(--pk-mobile-vv-offset-top)
      var(--pk-mobile-vv-offset-right)
      var(--pk-mobile-vv-offset-bottom)
      var(--pk-mobile-vv-offset-left) !important;
    width: auto !important;
    height: auto !important;
    padding: 0 !important;
  }

  html[data-ui-revision="pokemon-next"] .lab-games[data-game-mode="flight"] .lab-games__shell {
    width: 100% !important;
    height: 100% !important;
    grid-template-rows: auto minmax(0, 1fr) auto !important;
  }

  html[data-ui-revision="pokemon-next"] .lab-games[data-game-mode="flight"] .lab-games__header {
    min-height: 64px !important;
    padding:
      max(10px, var(--pk-safe-top))
      max(12px, var(--pk-safe-right))
      10px
      max(12px, var(--pk-safe-left)) !important;
  }

  html[data-ui-revision="pokemon-next"] .lab-games[data-game-mode="flight"] .lab-games__body {
    padding-right: max(8px, var(--pk-safe-right)) !important;
    padding-left: max(8px, var(--pk-safe-left)) !important;
  }

  html[data-ui-revision="pokemon-next"] .lab-games[data-game-mode="flight"] .lab-games__footer {
    padding:
      10px
      max(12px, var(--pk-safe-right))
      max(10px, var(--pk-safe-bottom))
      max(12px, var(--pk-safe-left)) !important;
  }

  html[data-ui-revision="pokemon-next"] .lab-games[data-game-mode="flight"] :is(
    .lab-games__header button,
    .lab-games__footer button,
    .lab-flight__hud button,
    .lab-flight__pause button
  ) {
    min-width: var(--pk-mobile-hit) !important;
    min-height: var(--pk-mobile-hit) !important;
    touch-action: manipulation;
  }

  /* Remaining P1 actions that legacy compact rules shrink below 44 CSS px. */
  html[data-ui-revision="pokemon-next"] :is(
    .profile-v80 button,
    .quest-mode-tabs-v57 button,
    .quest-status-tabs-v57 button,
    .quest-type-tabs-v57 button,
    .quest-widget-collapse,
    .quest-hud-journal-v68,
    .quest-tracker-choice-v62 > button,
    .pokedex-library button,
    .pokedex-detail button,
    .dex-detail-shell button,
    .pokemon-detail button,
    .game-screen .side-panel.is-pokemon-detail-panel button,
    .battle-quick-item,
    .battle-utility-button,
    .battle-capture-cancel
  ) {
    min-width: var(--pk-mobile-hit) !important;
    min-height: var(--pk-mobile-hit) !important;
    touch-action: manipulation;
  }

  html[data-ui-revision="pokemon-next"] .inventory-v52 :is(
    button,
    summary,
    .inventory-search-clear-v54,
    .inventory-search-clear-v55
  ) {
    min-width: var(--pk-mobile-hit) !important;
    min-height: var(--pk-mobile-hit) !important;
    touch-action: manipulation;
  }

  html[data-ui-revision="pokemon-next"] .inventory-v52 :is(.inventory-search-clear-v54, .inventory-search-clear-v55),
  html[data-ui-revision="pokemon-next"] .inventory-v52 :is(.inventory-sort-v54, .inventory-sort-v54 summary),
  html[data-ui-revision="pokemon-next"] .inventory-v52 .inventory-view-v54 button {
    width: var(--pk-mobile-hit) !important;
    height: var(--pk-mobile-hit) !important;
  }

  html[data-ui-revision="pokemon-next"] .inventory-v52 .inventory-view-v54 {
    grid-template-columns: repeat(2, var(--pk-mobile-hit)) !important;
    width: 97px !important;
    height: 50px !important;
  }

  html[data-ui-revision="pokemon-next"] .inventory-v52 .inventory-toolbar-v54 {
    min-height: 50px !important;
    flex-basis: 50px !important;
  }

  html[data-ui-revision="pokemon-next"] .inventory-v52 .inventory-categories-v52 > button,
  html[data-ui-revision="pokemon-next"] .inventory-v52 .inventory-capacity-v53 > button {
    height: var(--pk-mobile-hit) !important;
    min-height: var(--pk-mobile-hit) !important;
  }

  /* Keep the compact wallet geometry while extending each add action's hit box. */
  html[data-ui-revision="pokemon-next"] .game-screen .world-wallet-currency > button {
    position: relative !important;
    overflow: visible !important;
  }

  html[data-ui-revision="pokemon-next"] .game-screen .world-wallet-currency > button::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: var(--pk-mobile-hit);
    height: var(--pk-mobile-hit);
    transform: translate(-50%, -50%);
  }

  html[data-ui-revision="pokemon-next"] :where(
    #chatPanel,
    .starter-experience,
    .quarry,
    .lab-games[data-game-mode="flight"],
    .inventory-v52,
    .profile-v80,
    .pokedex-library,
    .pokedex-detail
  ) :where(button, [role="button"]) {
    -webkit-tap-highlight-color: transparent;
  }
}

@media (max-width: 380px) {
  html[data-ui-revision="pokemon-next"] .game-screen #chatPanel.chat-panel.chat-messenger {
    right: calc(var(--pk-mobile-vv-offset-right) + max(5px, var(--pk-safe-right))) !important;
    left: calc(var(--pk-mobile-vv-offset-left) + max(5px, var(--pk-safe-left))) !important;
  }

  html[data-ui-revision="pokemon-next"] .game-screen #chatPanel .chat-media-head {
    grid-template-columns: minmax(0, 1fr) auto !important;
    min-height: 52px !important;
  }

  html[data-ui-revision="pokemon-next"] .game-screen #chatPanel > .chat-emoji-panel {
    grid-template-rows: minmax(52px, auto) 54px minmax(0, 1fr) !important;
  }

  html[data-ui-revision="pokemon-next"] .game-screen #chatPanel .chat-emoji-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 2px !important;
    padding: 4px !important;
  }
}

@media (max-width: 760px) and (max-height: 520px) and (orientation: landscape) {
  html[data-ui-revision="pokemon-next"] .lab-games[data-game-mode="flight"] .lab-games__header {
    min-height: 54px !important;
    padding:
      max(5px, var(--pk-safe-top))
      max(12px, var(--pk-safe-right))
      5px
      max(12px, var(--pk-safe-left)) !important;
  }

  html[data-ui-revision="pokemon-next"] .lab-games[data-game-mode="flight"] .lab-games__footer {
    padding:
      5px
      max(12px, var(--pk-safe-right))
      max(5px, var(--pk-safe-bottom))
      max(12px, var(--pk-safe-left)) !important;
  }
}