/* ============================================================
   Scrapo mobile-web unlock - responsive & PWA support (v2)
   Brand: #128c37
   ============================================================ */

/* ---- optional iOS App Store banner (iOS visitors only) ---- */
.ios-app-banner{display:flex;align-items:center;gap:10px;padding:8px 12px;background:#fff;
  border-bottom:1px solid #e2e8e2;position:relative;z-index:1200;font-family:inherit}
.ios-app-banner_icon{width:36px;height:36px;border-radius:8px;flex-shrink:0}
.ios-app-banner_text{flex:1;min-width:0;line-height:1.25;font-size:12px;color:#556}
.ios-app-banner_text strong{display:block;font-size:13px;color:#1c2b21}
.ios-app-banner_get{background:#128c37;color:#fff!important;font-weight:600;font-size:13px;
  padding:7px 14px;border-radius:16px;text-decoration:none;flex-shrink:0}
.ios-app-banner_close{background:none;border:none;font-size:20px;line-height:1;color:#99a;
  padding:4px 6px;cursor:pointer;flex-shrink:0}

/* ---- modal system v2: wrapper is the ONLY scroller while open ----
   Fixes: off-center modal, background scrolling/pull-to-refresh behind
   the modal, and bottoms cut off by the iOS toolbar. */
html body.modal-open{overflow:hidden!important;position:relative;height:100%;}
.modalWrapper.open{position:fixed;top:0;left:0;right:0;bottom:0;width:100%;
  overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;}

@media screen and (max-width: 600px){
  /* stop pull-to-refresh / rubber-band chaining on the page itself */
  html,body{overscroll-behavior-y:none;}
  .modalWrapper.open .modal-window{display:block!important;position:relative!important;
    left:auto!important;right:auto!important;top:auto!important;transform:none!important;
    width:calc(100vw - 24px)!important;max-width:calc(100vw - 24px)!important;
    margin:16px auto 48px!important;border-radius:10px;
    max-height:none!important;overflow:visible!important;}
  .modalWrapper.open .modal-content{max-height:none!important;overflow:visible!important;}
  /* signup / login forms inside modals */
  .modalWrapper .modal-window .row .col.s6{width:100%!important;margin-left:0!important}
  .modalWrapper .modal-window .row{margin-bottom:0}
  .modalWrapper .modal-window .input-field input{font-size:16px}
  .modal_window_sign_in_form .input_group_inline,
  .modal_window_content input.input_std,
  .modal_window_content .modal_form_field{width:100%!important;margin-left:0!important;box-sizing:border-box}
  .modal_window_content{padding:12px 14px}
  .modal_window_content_footer button{width:100%;padding:13px 0;font-size:16px}
  .modal_window_content input,.modal_window_content select{font-size:16px}
  /* landing header CTAs fit small screens */
  .landing-header-top .button,.landing-header-middle .button{font-size:14px;padding:10px 18px}
  .landing-header-top .logo img{max-height:34px}
}

/* ---- small-screen polish for pages reached after login ---- */
@media screen and (max-width: 767px){
  .site-login,.login-card,.simple-card{width:auto!important;max-width:96vw!important;margin:12px auto!important}
  .table-responsive-fix,.profile-content table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  img{max-width:100%;height:auto}
}