/* R3.5.157 — MOBILE DEVICE CONFIRM SUPER HARD RESET
   Loaded AFTER mobile.css with a new cache-busted URL.
   Scope is intentionally limited to the final Device Check confirmation page.
   The final page no longer depends on fixed footer/brand-footer geometry.
   It uses one native vertical scroll surface and in-flow Back/Continue actions. */

@media (max-width:900px){
  /* Final-panel state: remove every fixed bottom blocker. */
  body.device-confirm-page.app-flow{
    overflow:hidden!important;
  }

  body.device-confirm-page .app-brand-footer,
  body.device-confirm-page #appBrandFooter,
  body.device-confirm-page .app-footer,
  body.device-confirm-page #appFooter,
  body.device-confirm-page .app-dots,
  body.device-confirm-page #appDots{
    display:none!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }

  /* Main viewport owns everything below header + compact step navigation. */
  body.device-confirm-page.app-flow .main{
    position:fixed!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    min-height:0!important;
    height:auto!important;
    overflow:hidden!important;
    padding:0!important;
  }

  /* One and only one scrolling surface. */
  body.device-confirm-page #screen-device.active{
    display:block!important;
    box-sizing:border-box!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    margin:0!important;
    padding:5px 10px calc(20px + env(safe-area-inset-bottom))!important;
    overflow-x:hidden!important;
    overflow-y:scroll!important;
    overscroll-behavior-y:contain!important;
    -webkit-overflow-scrolling:touch!important;
    touch-action:pan-y!important;
    scroll-behavior:auto!important;
    scroll-padding-bottom:24px!important;
    align-items:initial!important;
    justify-content:flex-start!important;
  }

  body.device-confirm-page #screen-device .device-root,
  body.device-confirm-page #screen-device .device-panel,
  body.device-confirm-page #screen-device .device-panel-section,
  body.device-confirm-page #screen-device .device-panel-section[data-device-panel="2"]:not([hidden]),
  body.device-confirm-page #screen-device .device-consents,
  body.device-confirm-page #screen-device .device-consent{
    box-sizing:border-box!important;
    max-height:none!important;
    overflow:visible!important;
  }

  body.device-confirm-page #screen-device .device-panel{
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    padding:9px!important;
    border-radius:16px!important;
  }

  body.device-confirm-page #screen-device .device-panel-section[data-device-panel="0"],
  body.device-confirm-page #screen-device .device-panel-section[data-device-panel="1"]{
    display:none!important;
  }

  body.device-confirm-page #screen-device .device-panel-section[data-device-panel="2"]:not([hidden]){
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
  }

  /* Header is deliberately compact so confirmation 3 is not pushed below fold. */
  body.device-confirm-page #screen-device .reference-panel-heading{
    display:block!important;
    margin:0 0 6px!important;
    padding:0 2px 6px!important;
    border-bottom:1px solid #dfe6ef!important;
  }

  body.device-confirm-page #screen-device .reference-panel-heading small{
    display:block!important;
    margin:0 0 2px!important;
    font-size:7.5px!important;
    line-height:1.1!important;
    letter-spacing:.08em!important;
  }

  body.device-confirm-page #screen-device .reference-panel-heading h3{
    margin:0!important;
    font-size:16px!important;
    line-height:1.08!important;
    letter-spacing:-.02em!important;
  }

  /* Information strip: no oversized icon/card. */
  body.device-confirm-page #screen-device .device-warning{
    display:grid!important;
    grid-template-columns:22px minmax(0,1fr)!important;
    align-items:center!important;
    gap:6px!important;
    margin:0 0 6px!important;
    padding:6px 7px!important;
    min-height:0!important;
    border-radius:9px!important;
    font-size:9px!important;
    line-height:1.2!important;
  }

  body.device-confirm-page #screen-device .device-warning b{
    width:21px!important;
    height:21px!important;
    min-width:21px!important;
    min-height:21px!important;
    font-size:12px!important;
  }

  /* Touch/typing block: reset grid/flex heights and keep the status in flow. */
  body.device-confirm-page #screen-device .device-typing-check{
    display:grid!important;
    grid-template-columns:1fr!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0 0 6px!important;
    padding:7px!important;
    gap:4px!important;
    border-radius:10px!important;
    overflow:visible!important;
  }

  body.device-confirm-page #screen-device .device-typing-check label{
    display:grid!important;
    gap:1px!important;
    margin:0!important;
  }

  body.device-confirm-page #screen-device .device-typing-check label strong{
    font-size:10.5px!important;
    line-height:1.15!important;
  }

  body.device-confirm-page #screen-device .device-typing-check label small,
  body.device-confirm-page #screen-device .device-typing-check > span{
    font-size:8.5px!important;
    line-height:1.18!important;
    margin:0!important;
  }

  body.device-confirm-page #screen-device .device-typing-check input{
    box-sizing:border-box!important;
    width:100%!important;
    height:36px!important;
    min-height:36px!important;
    max-height:36px!important;
    margin:0!important;
    padding:0 9px!important;
    border-radius:8px!important;
    font-size:13px!important;
    line-height:1!important;
  }

  /* Three confirmations: no legacy 82px min-height; each stays fully tappable. */
  body.device-confirm-page #screen-device .device-consents{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:5px!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
  }

  body.device-confirm-page #screen-device .device-consent{
    position:relative!important;
    display:grid!important;
    grid-template-columns:24px minmax(0,1fr)!important;
    align-items:center!important;
    gap:7px!important;
    width:100%!important;
    height:auto!important;
    min-height:46px!important;
    max-height:none!important;
    margin:0!important;
    padding:6px 8px!important;
    border-radius:10px!important;
    font-size:10px!important;
    line-height:1.2!important;
    cursor:pointer!important;
    pointer-events:auto!important;
    touch-action:manipulation!important;
    user-select:none!important;
  }

  body.device-confirm-page #screen-device .device-consent-icon{
    display:none!important;
  }

  body.device-confirm-page #screen-device .device-consent input[type="checkbox"]{
    position:static!important;
    inset:auto!important;
    display:block!important;
    box-sizing:border-box!important;
    width:22px!important;
    height:22px!important;
    min-width:22px!important;
    min-height:22px!important;
    max-width:22px!important;
    max-height:22px!important;
    margin:0!important;
    padding:0!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    appearance:auto!important;
    -webkit-appearance:checkbox!important;
    accent-color:#0a66bd!important;
    z-index:2!important;
  }

  body.device-confirm-page #screen-device .device-consent > span:last-child{
    display:block!important;
    min-width:0!important;
    margin:0!important;
    overflow:visible!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
  }

  /* In-flow controls replace fixed footer on final confirmation page. */
  body.device-confirm-page #screen-device .device-mobile-confirm-actions{
    display:grid!important;
    grid-template-columns:minmax(92px,.38fr) minmax(0,1fr)!important;
    gap:8px!important;
    width:100%!important;
    margin:7px 0 0!important;
    padding:0!important;
  }

  body.device-confirm-page #screen-device .device-mobile-confirm-actions .btn{
    width:100%!important;
    min-height:44px!important;
    height:auto!important;
    margin:0!important;
    padding:7px 9px!important;
    border-radius:10px!important;
    font-size:11px!important;
    line-height:1.15!important;
    white-space:normal!important;
    pointer-events:auto!important;
    touch-action:manipulation!important;
  }

  /* Compact the three module pills only while final confirm is open. */
  body.device-confirm-page.mobile-step-nav{
    --module-step-height:38px!important;
  }

  body.device-confirm-page .mobile-module-steps{
    height:38px!important;
    padding:3px 7px!important;
    gap:4px!important;
  }

  body.device-confirm-page .mobile-module-steps button{
    height:31px!important;
    min-height:31px!important;
    padding:2px 3px!important;
    gap:3px!important;
    border-radius:9px!important;
  }

  body.device-confirm-page .mobile-module-steps button b{
    width:17px!important;
    height:17px!important;
    flex-basis:17px!important;
    font-size:8px!important;
  }

  body.device-confirm-page .mobile-module-steps button span{
    font-size:7px!important;
    line-height:1!important;
  }
}

/* Short/narrow devices: preserve tap targets but remove decorative spacing. */
@media (max-width:390px), (max-width:900px) and (max-height:720px){
  body.device-confirm-page #screen-device.active{
    padding:4px 7px calc(16px + env(safe-area-inset-bottom))!important;
  }
  body.device-confirm-page #screen-device .device-panel{padding:7px!important;}
  body.device-confirm-page #screen-device .reference-panel-heading{margin-bottom:5px!important;padding-bottom:5px!important;}
  body.device-confirm-page #screen-device .reference-panel-heading h3{font-size:15px!important;}
  body.device-confirm-page #screen-device .device-warning{font-size:8.5px!important;padding:5px 6px!important;}
  body.device-confirm-page #screen-device .device-typing-check{padding:6px!important;margin-bottom:5px!important;}
  body.device-confirm-page #screen-device .device-consent{min-height:44px!important;padding:5px 7px!important;font-size:9.2px!important;}
  body.device-confirm-page #screen-device .device-mobile-confirm-actions{margin-top:6px!important;}
  body.device-confirm-page #screen-device .device-mobile-confirm-actions .btn{min-height:42px!important;font-size:10.5px!important;}
}

/* Desktop never uses the mobile in-flow action row. */
@media (min-width:901px){
  .device-mobile-confirm-actions{display:none!important;}
}
