/* =====================================================================
   88HARDWARE · Account & auth pages · touch layer (touch-pages-20261103 pkg-02-auth)
   Phone / iPad / touch only: everything is inside the inverse of the PC gate, so PC (>=1200 + hover + fine pointer) never applies it.
   Scope: Lost password (form, "sent" confirmation, reset form) = PC v2 design adapted to touch;
          Login / Register (h88 auth page) = touch-target fixes only (the page already has its own touch design).
   Colours / tokens = account-pages-pc-v2.css (approved PC v2). No markup, field, flow or copy is added here:
   the lost-password back link, help card and "Check your email" copy are the existing PC-v2 additions, shown on touch too.
   Live behaviour kept: account pages have no site header / footer on touch (88hardware-checkout-cleanup, "streamlined storefront").
   ===================================================================== */
@media not all and (min-width:1200px) and (hover:hover) and (pointer:fine){

/* ---------- tokens (same values as the PC v2 :root block, scoped to this page) ---------- */
html body.woocommerce-lost-password{
  --ap-red:#cf172d; --ap-red-7:#b4010e; --ap-red-50:#fff1f2;
  --ap-y-50:#fff7dc;
  --ap-navy:#06265f; --ap-navy6:#173958; --ap-ice:#eef4ff;
  --ap-ink:#181c22; --ap-text:#394655; --ap-muted:#67707b; --ap-dis:#a0a7af;
  --ap-line:#e2e5ea; --ap-line2:#edf0f4; --ap-soft:#f6f7f9; --ap-bg:#f3f4f6;
  --ap-e1:0 1px 2px rgba(16,24,40,.06);
  --ap-ease:cubic-bezier(.2,.7,.2,1);
  --ap-font:Inter,"PingFang SC","Hiragino Sans GB",system-ui,sans-serif;
  background:var(--ap-bg)!important}
html:has(>body.woocommerce-lost-password){background:#f3f4f6!important}

/* ===================== LOST PASSWORD ===================== */
html body.woocommerce-lost-password #main-content{width:auto!important;max-width:none!important;margin:0!important;padding:0 0 24px!important}
html body.woocommerce-lost-password #main-content>article{display:grid!important;grid-template-columns:minmax(0,1fr);gap:12px;align-items:start;max-width:none!important;margin:0!important;padding:calc(16px + env(safe-area-inset-top,0px)) 12px 0!important;font-family:var(--ap-font);color:var(--ap-text);background:transparent!important;box-sizing:border-box}
/* title module (PC: white bar + 4px red accent) */
html body.woocommerce-lost-password #main-content>article>h1{display:flex!important;align-items:center;gap:10px;height:56px;margin:0!important;padding:0 16px!important;background:#fff;border-radius:6px;box-shadow:var(--ap-e1);font:800 19px/24px var(--ap-font)!important;letter-spacing:-.02em!important;color:var(--ap-ink)!important;text-transform:none!important}
html body.woocommerce-lost-password #main-content>article>h1::before{content:"";flex:none;width:4px;height:18px;border-radius:2px;background:var(--ap-red)}
/* form card + icon tile (PC: tile in a left gutter; phone: tile above the copy) */
html body.woocommerce-lost-password #main-content>article>.woocommerce{position:relative;max-width:none!important;width:auto!important;margin:0!important;padding:20px 16px 8px!important;background:#fff;border-radius:6px;box-shadow:var(--ap-e1);box-sizing:border-box;font-family:var(--ap-font)}
html body.woocommerce-lost-password #main-content>article>.woocommerce::before{content:"";display:block;width:56px;height:56px;margin:0 0 16px;border-radius:14px;background:var(--ap-red-50) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23cf172d' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4.5' y='10.5' width='15' height='10' rx='2'/%3E%3Cpath d='M8 10.5V7.5a4 4 0 0 1 8 0v3'/%3E%3Ccircle cx='12' cy='15.5' r='1.2'/%3E%3C/svg%3E") center/26px no-repeat}
html body.woocommerce-lost-password #main-content>article .woocommerce-notices-wrapper:empty{display:none}
html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword{margin:0!important;padding:0!important;border:0!important;max-width:none}
html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword>p:first-child{margin:0 0 20px!important;font:500 15px/23px var(--ap-font)!important;color:var(--ap-text)!important}
html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword .form-row{float:none!important;width:100%!important;margin:0 0 16px!important;padding:0!important}
html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword .clear{display:none}
html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword .form-row:last-of-type{margin:4px 0 0!important}
html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword label{display:block!important;margin:0 0 6px!important;font:600 13px/18px var(--ap-font)!important;color:var(--ap-ink)!important}
html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword label .required{color:var(--ap-red)!important;text-decoration:none!important;border:0!important}
/* 16px text so iOS does not zoom on focus; 48px tall touch field */
html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword :is(input[type=text],input[type=email],input[type=password]){box-sizing:border-box!important;width:100%!important;height:48px!important;margin:0!important;padding:0 12px!important;border:1px solid var(--ap-line)!important;border-radius:4px!important;background:#fff!important;box-shadow:none!important;font:500 16px/22px var(--ap-font)!important;color:var(--ap-ink)!important;-webkit-appearance:none;appearance:none}
html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword :is(input[type=text],input[type=email],input[type=password]):focus{outline:0!important;border-color:var(--ap-navy)!important;box-shadow:0 0 0 3px rgba(6,38,95,.12)!important}
html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword ::placeholder{color:var(--ap-dis)!important;opacity:1}
html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword .password-input{display:block;position:relative;width:100%}
/* core show-password eye: same icon and position, 44x44 hit area (centre unchanged) */
html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword .password-input input{padding-right:48px!important}
html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword .show-password-input{display:flex!important;align-items:center;justify-content:center;width:44px!important;height:44px!important;top:24px!important;right:1px!important;transform:translateY(-22px)!important;margin:0!important;padding:0!important;-webkit-tap-highlight-color:transparent}
html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword button.button{display:block;width:100%;height:48px!important;min-width:0;margin:0!important;padding:0 24px!important;border:0!important;border-radius:3px!important;background:var(--ap-red)!important;color:#fff!important;font:700 15px/48px var(--ap-font)!important;text-transform:none!important;letter-spacing:0!important;box-shadow:0 2px 0 var(--ap-red-7)!important;-webkit-tap-highlight-color:transparent}
html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword button.button:active{background:var(--ap-red-7)!important}
/* reset form (from the email link) */
html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword:has(#password_1){display:grid;grid-template-columns:minmax(0,1fr);column-gap:16px}
html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword:has(#password_1)>p:first-child,html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword:has(#password_1)>.form-row:last-of-type{grid-column:1/-1}
/* sent confirmation: PC copy ("Check your email" + approved text), mail tile */
html body.woocommerce-lost-password #main-content>article .woocommerce-message{position:static!important;display:flex!important;align-items:center;gap:10px;margin:0 0 12px!important;padding:0!important;border:0!important;outline:0!important;background:none!important;box-shadow:none!important;font:800 20px/26px var(--ap-font)!important;letter-spacing:-.02em;color:var(--ap-ink)!important}
html body.woocommerce-lost-password #main-content>article .woocommerce-message::before{content:""!important;position:static!important;display:block!important;flex:none;width:26px;height:26px;margin:0!important;border-radius:50%;background:var(--ap-navy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4 8-9'/%3E%3C/svg%3E") center/16px no-repeat;color:transparent!important;font-size:0!important}
html body.woocommerce-lost-password #main-content>article>.woocommerce:has(>.woocommerce-message)::before{background-color:var(--ap-ice);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2306265f' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3.5 6.5 8.5 6.5 8.5-6.5'/%3E%3C/svg%3E")}
html body.woocommerce-lost-password #main-content>article>.woocommerce:has(>.woocommerce-message)>p:not(.h88ap-back){margin:0!important;font:500 15px/23px var(--ap-font)!important;color:var(--ap-text)!important}
html body.woocommerce-lost-password #main-content>article>.woocommerce [data-h88ap="pc-hide"]{display:none!important}
html body.woocommerce-lost-password #main-content>article>.woocommerce span[data-h88ap="addition"]{display:inline!important}
/* back to login (PC v2 addition) */
html body.woocommerce-lost-password #main-content>article .h88ap-back[data-h88ap="addition"]{display:block!important;margin:20px 0 0!important;padding:4px 0 0!important;border-top:1px solid var(--ap-line2)}
html body.woocommerce-lost-password #main-content>article .h88ap-back a{display:inline-flex;align-items:center;gap:4px;min-height:44px;padding:0 8px 0 0;font:600 14px/20px var(--ap-font);color:var(--ap-navy6)!important;text-decoration:none!important;-webkit-tap-highlight-color:transparent}
html body.woocommerce-lost-password #main-content>article .h88ap-back a svg{color:var(--ap-red)}
/* "Can't get in?" help card (PC v2 addition) */
html body.woocommerce-lost-password #main-content>article .h88ap-help[data-h88ap="addition"]{display:block!important;background:#fff;border-radius:6px;box-shadow:var(--ap-e1);overflow:hidden;font-family:var(--ap-font)}
html body.woocommerce-lost-password #main-content>article .h88ap-help h2{display:flex;align-items:center;gap:10px;height:52px;margin:0!important;padding:0 16px!important;border-bottom:1px solid var(--ap-line2);font:800 17px/22px var(--ap-font)!important;letter-spacing:-.02em;color:var(--ap-ink)!important;text-transform:none!important}
html body.woocommerce-lost-password #main-content>article .h88ap-help h2::before{content:"";flex:none;width:4px;height:18px;border-radius:2px;background:var(--ap-red)}
html body.woocommerce-lost-password #main-content>article .h88ap-help>p{margin:12px 16px 4px!important;font:500 13px/18px var(--ap-font)!important;color:var(--ap-muted)!important}
html body.woocommerce-lost-password #main-content>article .h88ap-help ul{margin:0!important;padding:0 4px 4px!important;list-style:none}
html body.woocommerce-lost-password #main-content>article .h88ap-help li{margin:0!important;padding:0!important;list-style:none}
html body.woocommerce-lost-password #main-content>article .h88ap-help li+li{border-top:1px solid var(--ap-line2)}
html body.woocommerce-lost-password #main-content>article .h88ap-help li a{display:flex;align-items:center;gap:12px;min-height:60px;padding:10px 12px!important;border-radius:4px;box-sizing:border-box;text-decoration:none!important;color:var(--ap-ink)!important;-webkit-tap-highlight-color:transparent}
html body.woocommerce-lost-password #main-content>article .h88ap-help li a:active{background:var(--ap-soft)}
html body.woocommerce-lost-password #main-content>article .h88ap-help li a>svg:first-child{flex:none;width:40px;height:40px;padding:10px;border-radius:12px;background:var(--ap-ice);color:var(--ap-navy);box-sizing:border-box}
html body.woocommerce-lost-password #main-content>article .h88ap-help li:first-child a>svg:first-child{background:var(--ap-red-50);color:var(--ap-red)}
html body.woocommerce-lost-password #main-content>article .h88ap-help li a span{flex:1;min-width:0}
html body.woocommerce-lost-password #main-content>article .h88ap-help li a b{display:block;font:700 14px/20px var(--ap-font)}
html body.woocommerce-lost-password #main-content>article .h88ap-help li a em{display:block;font:500 12px/16px var(--ap-font);font-style:normal;color:var(--ap-muted)}
html body.woocommerce-lost-password #main-content>article .h88ap-help li a>svg:last-of-type{flex:none;color:var(--ap-dis)}
html body.woocommerce-lost-password #main-content>article .h88ap-help .h88ap-help-new{display:flex;flex-wrap:wrap;align-items:center;column-gap:4px;margin:0!important;padding:0 16px!important;min-height:52px;border-top:1px solid var(--ap-line2);background:var(--ap-y-50);font:500 13px/18px var(--ap-font)!important;color:var(--ap-text)!important}
html body.woocommerce-lost-password #main-content>article .h88ap-help .h88ap-help-new a{display:inline-flex;align-items:center;min-height:44px;font-weight:700;color:var(--ap-red)!important;text-decoration:none!important}
html body.woocommerce-lost-password #main-content:not(#h88ap-x) :is(a,button):focus-visible{outline:2px solid var(--ap-navy)!important;outline-offset:2px!important}

/* ---------- iPad portrait (768-1023): one centred column ---------- */
@media (min-width:768px){
html body.woocommerce-lost-password #main-content>article{max-width:640px!important;margin:0 auto!important;padding:calc(32px + env(safe-area-inset-top,0px)) 0 0!important;gap:16px}
html body.woocommerce-lost-password #main-content>article>h1{height:64px;padding:0 20px!important;font-size:20px!important;line-height:26px!important}
html body.woocommerce-lost-password #main-content>article>.woocommerce{padding:32px 32px 12px 112px!important;min-height:0}
html body.woocommerce-lost-password #main-content>article>.woocommerce::before{position:absolute;left:32px;top:32px;width:56px;height:56px;margin:0}
html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword button.button{display:inline-block;width:auto;min-width:200px}
html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword:has(#password_1){grid-template-columns:1fr 1fr}
html body.woocommerce-lost-password #main-content>article .woocommerce-message{font-size:22px!important;line-height:28px!important}
html body.woocommerce-lost-password #main-content>article .h88ap-back[data-h88ap="addition"]{margin-top:24px!important;padding-top:8px!important}
html body.woocommerce-lost-password #main-content>article .h88ap-help h2{height:56px;padding:0 20px!important;font-size:18px!important;line-height:24px!important}
html body.woocommerce-lost-password #main-content>article .h88ap-help>p{margin:14px 20px 6px!important}
html body.woocommerce-lost-password #main-content>article .h88ap-help ul{padding:0 8px 8px!important}
html body.woocommerce-lost-password #main-content>article .h88ap-help .h88ap-help-new{padding:0 20px!important}
}
/* ---------- iPad landscape / large touch (>=1024): PC two-column layout ---------- */
@media (min-width:1024px){
html body.woocommerce-lost-password #main-content>article{grid-template-columns:minmax(0,1fr) 360px;max-width:1080px!important;padding:calc(24px + env(safe-area-inset-top,0px)) 24px 0!important;box-sizing:border-box}
html body.woocommerce-lost-password #main-content>article>h1{grid-column:1/-1}
html body.woocommerce-lost-password #main-content>article>.woocommerce{grid-column:1;padding:40px 40px 16px 128px!important;min-height:320px}
html body.woocommerce-lost-password #main-content>article>.woocommerce::before{left:40px;top:40px;width:64px;height:64px;background-size:30px}
html body.woocommerce-lost-password #main-content>article .h88ap-help[data-h88ap="addition"]{grid-column:2}
}

/* ===================== LOGIN / REGISTER (h88 auth page): touch targets only ===================== */
/* top bar "Help": 44px wide hit area (padding + equal negative margin: nothing moves) */
html body.h88-auth-page-active .h88-auth-page-nav>a:last-child{padding-left:14px!important;margin-left:-14px!important}
/* "Forgot password?": 40 -> 44px tall hit area, nothing moves */
html body.h88-auth-page-active .h88-auth-forgot a{min-height:44px!important;margin-top:-2px!important;margin-bottom:-2px!important}
/* "Login" / "Register" switch links: +10px hit width, nothing moves (already 44px tall) */
html body.h88-auth-page-active .h88-auth-switch a{padding:0 5px!important;margin:0 -5px!important}
/* privacy policy link inside the register note: taller hit area, no layout change (inline padding does not move lines) */
html body.h88-auth-page-active .woocommerce-privacy-policy-text a.woocommerce-privacy-policy-link,html body.h88-auth-page-active a.woocommerce-privacy-policy-link{padding:15px 0;margin:-15px 0;-webkit-box-decoration-break:clone;box-decoration-break:clone}
}