/* =====================================================================
   88HARDWARE · Account & auth pages · PC v2 (approved design 2026-10-21, build 2026-10-22)
   Loaded by mu-plugins/88hardware-account-pages-pc-v2.php on is_account_page(). Generated by tools/make_css.py; do not hand-edit.
   Login / Register (h88 auth page), Lost password (+ sent, reset), Order details (view-order),
   Addresses (88hardware-address-book-v1), Account details (edit-account).
   CSS only on the existing markup; selectors marked [ADD] style the few display-only additions (spec.md).
   Logged-in pages sit on top of the live My Account overview CSS (overview-pc v4.1 + account UI) and reuse its tokens.
   Scope: (min-width:1200px) and (hover:hover) and (pointer:fine); phone/tablet/touch untouched.
   ===================================================================== */
@media (min-width:1200px) and (hover:hover) and (pointer:fine){
:root{
  --ap-red:#cf172d; --ap-red-7:#b4010e; --ap-red-50:#fff1f2;
  --ap-y:#ffce45; --ap-y-ink:#3b2a00; --ap-y-50:#fff7dc; --ap-star:#f2a900;
  --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-e2:0 8px 24px rgba(4,37,88,.10);
  --ap-ease:cubic-bezier(.2,.7,.2,1);
  --ap-font:Inter,"PingFang SC","Hiragino Sans GB",system-ui,sans-serif;
}

/* ===================== shared form controls ===================== */
:is(html body.woocommerce-lost-password #main-content, html body.h88aui-account.logged-in:is(.woocommerce-edit-address,.woocommerce-edit-account) #main-content .woocommerce-MyAccount-content) :is(input[type=text],input[type=email],input[type=tel],input[type=password],select,textarea){box-sizing:border-box!important;width:100%!important;height:44px!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 14px/20px var(--ap-font)!important;color:var(--ap-ink)!important;transition:border-color .12s var(--ap-ease),box-shadow .12s var(--ap-ease)}
:is(html body.woocommerce-lost-password #main-content, html body.h88aui-account.logged-in:is(.woocommerce-edit-address,.woocommerce-edit-account) #main-content .woocommerce-MyAccount-content) :is(input,select):hover{border-color:#c9ced6!important}
:is(html body.woocommerce-lost-password #main-content, html body.h88aui-account.logged-in:is(.woocommerce-edit-address,.woocommerce-edit-account) #main-content .woocommerce-MyAccount-content) :is(input,select,textarea):focus{outline:0!important;border-color:var(--ap-navy)!important;box-shadow:0 0 0 3px rgba(6,38,95,.12)!important}
:is(html body.woocommerce-lost-password #main-content, html body.h88aui-account.logged-in:is(.woocommerce-edit-address,.woocommerce-edit-account) #main-content .woocommerce-MyAccount-content) ::placeholder{color:var(--ap-dis)!important;opacity:1}
:is(html body.woocommerce-lost-password #main-content, html body.h88aui-account.logged-in:is(.woocommerce-edit-address,.woocommerce-edit-account) #main-content .woocommerce-MyAccount-content) label{display:block!important;margin:0 0 6px!important;font:600 13px/18px var(--ap-font)!important;color:var(--ap-ink)!important}
:is(html body.woocommerce-lost-password #main-content, html body.h88aui-account.logged-in:is(.woocommerce-edit-address,.woocommerce-edit-account) #main-content .woocommerce-MyAccount-content) label .required,:is(html body.woocommerce-lost-password #main-content, html body.h88aui-account.logged-in:is(.woocommerce-edit-address,.woocommerce-edit-account) #main-content .woocommerce-MyAccount-content) label abbr.required{color:var(--ap-red)!important;text-decoration:none!important;border:0!important}
:is(html body.woocommerce-lost-password #main-content, html body.h88aui-account.logged-in:is(.woocommerce-edit-address,.woocommerce-edit-account) #main-content .woocommerce-MyAccount-content) label .optional{font-weight:500!important;color:var(--ap-muted)!important}
:is(html body.woocommerce-lost-password #main-content, html body.h88aui-account.logged-in:is(.woocommerce-edit-address,.woocommerce-edit-account) #main-content .woocommerce-MyAccount-content) select{appearance:none!important;-webkit-appearance:none!important;padding-right:36px!important;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2367707b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right 12px center/16px no-repeat!important}

/* ===================== LOGIN / REGISTER (h88 auth page, live shell) ===================== */
/* Live behaviour kept: site header, footer and tool rail are hidden on this page by the live accounts CSS; its own nav stays. */
html body.h88-auth-page-active{background:var(--ap-bg)!important}
html body.h88-auth-page-active .h88-auth-page{min-height:100vh;padding:0 0 48px!important;font-family:var(--ap-font);color:var(--ap-text)}
/* minimal auth header: full-width white bar, logo centred (same red wordmark as the site header is not used here live; keep) */
html body.h88-auth-page-active .h88-auth-page-nav{max-width:none!important;height:72px;margin:0 0 32px!important;padding:0 max(40px,calc((100% - 1080px)/2))!important;background:#fff;border-bottom:1px solid var(--ap-line2);box-shadow:var(--ap-e1)}
html body.h88-auth-page-active .h88-auth-page-nav>a{font:600 14px/20px var(--ap-font)!important;color:var(--ap-navy6)!important;gap:6px}
html body.h88-auth-page-active .h88-auth-page-nav>a:hover{color:var(--ap-red)!important}
html body.h88-auth-page-active .h88-auth-page-nav .h88-auth-brand img{display:block;height:34px;width:auto}
html body.h88-auth-page-active .h88-auth-page-nav>a:last-child::before{content:"";width:18px;height:18px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M9.6 9.2a2.5 2.5 0 1 1 3.3 2.4c-.6.3-.9.8-.9 1.5v.4'/%3E%3Cpath d='M12 16.8v.2'/%3E%3C/svg%3E") center/18px no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M9.6 9.2a2.5 2.5 0 1 1 3.3 2.4c-.6.3-.9.8-.9 1.5v.4'/%3E%3Cpath d='M12 16.8v.2'/%3E%3C/svg%3E") center/18px no-repeat}
/* two-panel card */
html body.h88-auth-page-active .h88-auth-layout{grid-template-columns:minmax(0,1fr) 480px!important;width:1080px!important;max-width:calc(100vw - 160px)!important;margin:0 auto!important;border-radius:6px!important;overflow:hidden;background:#fff;box-shadow:var(--ap-e2)!important;border:0!important;gap:0!important;min-height:600px}
/* promotion panel: homepage red, subtle diagonal texture, yellow accents */
html body.h88-auth-page-active .h88-auth-promotion{display:flex!important;flex-direction:column;padding:40px 44px 36px!important;background:linear-gradient(135deg,#cf172d 0%,#b4010e 62%,#8f0010 100%)!important;color:#fff!important;border-radius:0!important;isolation:isolate}
html body.h88-auth-page-active .h88-auth-promotion::before{content:"";position:absolute;inset:0;z-index:-1;background:repeating-linear-gradient(-45deg,rgba(255,255,255,.035) 0 2px,transparent 2px 14px)}
html body.h88-auth-page-active .h88-auth-promotion::after{content:"";position:absolute;right:-120px;top:-140px;width:380px;height:380px;border-radius:50%;z-index:-1;background:radial-gradient(circle,rgba(255,206,69,.28),transparent 65%)}
html body.h88-auth-page-active .h88-auth-promotion-brand{margin:0 0 20px!important}
html body.h88-auth-page-active .h88-auth-promotion-brand img{display:block;height:34px!important;width:auto!important}
html body.h88-auth-page-active .h88-auth-promotion h2{margin:0!important;font:800 44px/48px var(--ap-font)!important;letter-spacing:-.035em!important;color:#fff!important}
html body.h88-auth-page-active .h88-auth-promotion-subtitle{margin:12px 0 24px!important;font:600 16px/22px var(--ap-font)!important;color:rgba(255,255,255,.86)!important}
html body.h88-auth-page-active .h88-auth-promotion-image{width:100%!important;height:auto!important;max-height:260px;object-fit:cover;border-radius:6px!important;box-shadow:0 10px 30px rgba(60,0,8,.35);margin:0!important}
html body.h88-auth-page-active .h88-auth-promotion-note{display:flex!important;align-items:center;gap:14px;margin:auto 0 0!important;padding:16px 18px!important;border:0!important;border-radius:6px;background:rgba(0,0,0,.18);position:relative}
html body.h88-auth-page-active .h88-auth-promotion-note::before{content:"";flex:none;width:40px;height:40px;border-radius:50%;background:var(--ap-y) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%233b2a00' d='m12 2.8 2.8 5.8 6.3.9-4.6 4.4 1.1 6.3L12 17.2l-5.6 3 1.1-6.3-4.6-4.4 6.3-.9z'/%3E%3C/svg%3E") center/20px no-repeat}
html body.h88-auth-page-active .h88-auth-promotion-note strong{display:block;font:800 16px/22px var(--ap-font)!important;color:var(--ap-y)!important}
html body.h88-auth-page-active .h88-auth-promotion-note p{margin:2px 0 0!important;font:500 14px/20px var(--ap-font)!important;color:rgba(255,255,255,.88)!important}
/* form panel */
html body.h88-auth-page-active .h88-auth-layout .h88-auth-card{max-width:none!important;padding:36px 44px 32px!important;border:0!important;border-radius:0!important;box-shadow:none!important;color:var(--ap-text)!important}
html body.h88-auth-page-active .h88-auth-tabs{gap:28px;margin:0 0 28px!important;border-bottom:1px solid var(--ap-line2)!important}
html body.h88-auth-page-active .h88-auth-tabs a{padding:0 0 12px!important;border-bottom-width:3px!important;font:700 16px/22px var(--ap-font)!important;color:var(--ap-muted)!important}
html body.h88-auth-page-active .h88-auth-tabs a:hover{color:var(--ap-ink)!important}
html body.h88-auth-page-active .h88-auth-tabs a[aria-current="page"]{color:var(--ap-ink)!important;border-bottom-color:var(--ap-red)!important}
html body.h88-auth-page-active .h88-auth-surface.h88-auth-card h1,html body.h88-auth-page-active .h88-auth-surface.h88-auth-card h2#h88-auth-page-register-title{margin:0 0 6px!important;font:800 28px/34px var(--ap-font)!important;letter-spacing:-.025em!important;color:var(--ap-ink)!important}
html body.h88-auth-page-active .h88-auth-page-panel[data-h88-auth-panel="login"] h1{margin-bottom:22px!important}
html body.h88-auth-page-active .h88-auth-layout .h88-auth-form>.h88-auth-intro{margin:0 0 20px!important;font:500 14px/20px var(--ap-font)!important;color:var(--ap-muted)!important}
html body.h88-auth-page-active .h88-auth-surface .h88-auth-form>p,html body.h88-auth-page-active .h88-auth-surface .h88-auth-pair>p{margin:0 0 16px!important}
html body.h88-auth-page-active .h88-auth-layout .h88-auth-card .h88-auth-pair{grid-template-columns:1fr 1fr!important;gap:0 12px!important}
html body.h88-auth-page-active .h88-auth-surface .h88-auth-form label:not(.h88-auth-remember){margin:0 0 6px!important;font:600 13px/18px var(--ap-font)!important;color:var(--ap-ink)!important}
html body.h88-auth-page-active .h88-auth-surface .h88-auth-form label .required{color:var(--ap-red)!important}
html body.h88-auth-page-active .h88-auth-surface .h88-auth-form label .optional{font-weight:500;color:var(--ap-muted)}
html body.h88-auth-page-active .h88-auth-surface .h88-auth-form input:not([type=hidden]):not([type=checkbox]):not([type=radio]){min-height:44px!important;height:44px!important;padding:0 12px!important;border:1px solid var(--ap-line)!important;border-radius:4px!important;font:500 14px/20px var(--ap-font)!important;color:var(--ap-ink)!important;box-shadow:none!important}
html body.h88-auth-page-active .h88-auth-surface .h88-auth-form input:not([type=hidden]):not([type=checkbox]):focus{outline:0!important;border-color:var(--ap-navy)!important;box-shadow:0 0 0 3px rgba(6,38,95,.12)!important}
html body.h88-auth-page-active .h88-auth-surface .h88-auth-password input{padding-right:64px!important}
html body.h88-auth-page-active .h88-auth-surface .h88-password-toggle{min-height:44px!important;color:var(--ap-navy6)!important;font:700 12px/16px var(--ap-font)!important}
html body.h88-auth-page-active .h88-auth-surface .h88-auth-remember{min-height:24px!important;margin:0 0 20px!important;font:500 14px/20px var(--ap-font)!important;color:var(--ap-text)!important;gap:8px!important}
html body.h88-auth-page-active .h88-auth-surface .h88-auth-remember input{accent-color:var(--ap-red)!important}
html body.h88-auth-page-active .h88-auth-surface .h88-auth-submit{min-height:48px!important;border-radius:3px!important;background:var(--ap-red)!important;font:700 16px/24px var(--ap-font)!important;box-shadow:0 2px 0 var(--ap-red-7)!important}
html body.h88-auth-page-active .h88-auth-surface .h88-auth-submit:hover{background:var(--ap-red-7)!important}
html body.h88-auth-page-active .h88-auth-surface .h88-auth-form>p.h88-auth-forgot{margin:12px 0 0!important;font:600 13px/18px var(--ap-font)!important}
html body.h88-auth-page-active .h88-auth-surface a{color:var(--ap-navy6)!important;text-decoration:none!important}
html body.h88-auth-page-active .h88-auth-surface a:hover{color:var(--ap-red)!important}
/* "or" divider before Google (CSS only, sits on the existing social-login container) */
html body.h88-auth-page-active .h88-auth-surface .nsl-container{position:relative;margin-top:20px!important;padding-top:28px!important}
html body.h88-auth-page-active .h88-auth-surface .nsl-container::before{content:"or";position:absolute;left:50%;top:0;transform:translateX(-50%);padding:0 12px;background:#fff;font:600 12px/16px var(--ap-font);color:var(--ap-muted);z-index:1}
html body.h88-auth-page-active .h88-auth-surface .nsl-container::after{content:"";position:absolute;left:0;right:0;top:8px;height:1px;background:var(--ap-line2)}
html body.h88-auth-page-active .h88-auth-surface .nsl-container .nsl-button{min-height:44px!important;border:1px solid var(--ap-line)!important;border-radius:3px!important;box-shadow:none!important;display:flex!important;align-items:center;justify-content:center}
html body.h88-auth-page-active .h88-auth-surface .nsl-container .nsl-button:hover{background:var(--ap-soft)!important}
html body.h88-auth-page-active .h88-auth-surface .nsl-button-label-container{font:500 14px/20px var(--ap-font)!important;color:var(--ap-ink)!important}
html body.h88-auth-page-active .h88-auth-surface .h88-auth-switch{margin:24px 0 0!important;padding-top:16px!important;border-top:1px solid var(--ap-line2)!important;font:500 14px/20px var(--ap-font)!important;color:var(--ap-muted)!important}
html body.h88-auth-page-active .h88-auth-surface .h88-auth-switch a{min-height:0!important;color:var(--ap-red)!important;font-weight:700!important}
html body.h88-auth-page-active .h88-auth-surface .woocommerce-privacy-policy-text{margin:0 0 16px!important;font:500 12px/17px var(--ap-font)!important;color:var(--ap-muted)!important}
html body.h88-auth-page-active .h88-auth-surface .h88-auth-notices .woocommerce-error{border-radius:4px!important;border-color:#f3c2c8!important;background:var(--ap-red-50)!important;color:#a3101f!important;font:600 13px/18px var(--ap-font)!important}
html body.h88-auth-page-active .h88-auth-surface .h88-auth-notices .woocommerce-message,html body.h88-auth-page-active .h88-auth-surface .h88-auth-notices .woocommerce-info{border-radius:4px!important;border-color:#d6e2f5!important;background:var(--ap-ice)!important;color:var(--ap-navy)!important}
html body.h88-auth-page-active :is(.h88-auth-surface,.h88-auth-page-nav) :focus-visible{outline:2px solid var(--ap-navy)!important;outline-offset:2px!important}

/* ===================== LOST PASSWORD (live page, live header/footer) ===================== */
html body.woocommerce-lost-password #main-content>article{display:grid!important;grid-template-columns:minmax(0,1fr) 418px;gap:16px;align-items:start;max-width:none!important;margin:0!important;padding:20px 0 0!important;font-family:var(--ap-font);color:var(--ap-text);background:transparent!important}
html body.woocommerce-lost-password{background:var(--ap-bg)!important}
html body.woocommerce-lost-password .h88-footer-space{height:40px!important;background:transparent!important}
html body.woocommerce-lost-password #main-content>article>h1{grid-column:1/-1;display:flex!important;align-items:center;gap:10px;height:65px;margin:0!important;padding:0 20px!important;background:#fff;border-radius:6px;box-shadow:var(--ap-e1);font:800 20px/26px var(--ap-font)!important;letter-spacing:-.02em!important;color:var(--ap-ink)!important}
html body.woocommerce-lost-password #main-content>article>h1::before{content:"";flex:none;width:4px;height:20px;border-radius:2px;background:var(--ap-red)}
html body.woocommerce-lost-password #main-content>article>.woocommerce{grid-column:1;max-width:none!important;width:auto!important;margin:0!important;padding:40px 48px 36px 136px!important;background:#fff;border-radius:6px;box-shadow:var(--ap-e1);position:relative;min-height:320px;box-sizing:border-box}
/* key icon tile (decorative) */
html body.woocommerce-lost-password #main-content>article>.woocommerce::before{content:"";position:absolute;left:48px;top:40px;width:64px;height:64px;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/30px no-repeat}
html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword{margin:0!important;padding:0!important;border:0!important;max-width:560px}
html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword>p:first-child{margin:0 0 24px!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;max-width:440px;margin:0 0 20px!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 button.button{height:44px!important;min-width:200px;padding:0 28px!important;border:0!important;border-radius:3px!important;background:var(--ap-red)!important;color:#fff!important;font:700 15px/44px var(--ap-font)!important;box-shadow:0 2px 0 var(--ap-red-7)!important}
html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword button.button:hover{background:var(--ap-red-7)!important}
/* reset form (from the email link): two fields side by side */
html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword:has(#password_1){display:grid;grid-template-columns:1fr 1fr;column-gap:16px;max-width:none}
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}
html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword:has(#password_1) .form-row{max-width:none}
/* sent confirmation */
html body.woocommerce-lost-password #main-content>article .woocommerce-message{display:flex!important;align-items:center;gap:10px;margin:0 0 14px!important;padding:0!important;border:0!important;background:none!important;font:800 22px/28px 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;flex:none;width:26px;height:26px;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;margin: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){max-width:600px;margin:0!important;font:500 15px/23px var(--ap-font)!important;color:var(--ap-text)!important}
/* [ADD] back to login */
html body.woocommerce-lost-password #main-content>article .h88ap-back{margin:28px 0 0!important;padding-top:20px;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;font:600 14px/20px var(--ap-font);color:var(--ap-navy6)!important;text-decoration:none!important}
html body.woocommerce-lost-password #main-content>article .h88ap-back a svg{color:var(--ap-red)}
html body.woocommerce-lost-password #main-content>article .h88ap-back a:hover{color:var(--ap-red)!important}
/* [ADD] help aside */
html body.woocommerce-lost-password #main-content>article .h88ap-help{grid-column:2;background:#fff;border-radius:6px;box-shadow:var(--ap-e1);overflow:hidden}
html body.woocommerce-lost-password #main-content>article .h88ap-help h2{display:flex;align-items:center;gap:10px;height:56px;margin:0!important;padding:0 20px!important;border-bottom:1px solid var(--ap-line2);font:800 18px/24px var(--ap-font)!important;letter-spacing:-.02em;color:var(--ap-ink)!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:14px 20px 6px!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 8px 8px!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 a{display:flex;align-items:center;gap:12px;padding:12px!important;border-radius:4px;text-decoration:none!important;color:var(--ap-ink)!important;transition:background .12s var(--ap-ease)}
html body.woocommerce-lost-password #main-content>article .h88ap-help li a:hover{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{color:var(--ap-dis)}
html body.woocommerce-lost-password #main-content>article .h88ap-help .h88ap-help-new{margin:0!important;padding:14px 20px!important;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{font-weight:700;color:var(--ap-red)!important;text-decoration:none!important}

/* ===================== LOGGED-IN ENDPOINTS (shared) ===================== */
/* The live overview CSS makes these tabs one white card; v1 splits them into modules on the grey canvas instead. */
html body.h88aui-account.logged-in:is(.woocommerce-view-order,.woocommerce-edit-address,.woocommerce-edit-account) #main-content .woocommerce-MyAccount-content:not(#h88ap-x),html body.h88aui-account.logged-in:is(.woocommerce-view-order,.woocommerce-edit-address,.woocommerce-edit-account) #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88aui-tab-panel{background:transparent!important;padding:0!important;border-radius:0!important;box-shadow:none!important}
html body.h88aui-account.logged-in:is(.woocommerce-view-order,.woocommerce-edit-address,.woocommerce-edit-account) #main-content .woocommerce-MyAccount-content:not(#h88ap-x){font-family:var(--ap-font);color:var(--ap-text)}
html body.h88aui-account.logged-in:is(.woocommerce-view-order,.woocommerce-edit-address,.woocommerce-edit-account) #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88aui-tab-panels{display:block}
/* page title (account UI h1) = title module, same as Cart / Checkout and the overview modules */
html body.h88aui-account.logged-in:is(.woocommerce-view-order,.woocommerce-edit-address,.woocommerce-edit-account) #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>h1.h88aui-page-title{display:flex!important;align-items:center;gap:10px;height:56px;margin:0 0 16px!important;padding:0 20px!important;background:#fff;border-radius:6px;box-shadow:var(--ap-e1);font:800 20px/26px var(--ap-font)!important;letter-spacing:-.02em!important;color:var(--ap-ink)!important;position:static!important;clip:auto!important;width:auto!important;overflow:visible!important}
html body.h88aui-account.logged-in:is(.woocommerce-view-order,.woocommerce-edit-address,.woocommerce-edit-account) #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>h1.h88aui-page-title::before{content:"";flex:none;width:4px;height:20px;border-radius:2px;background:var(--ap-red)}
html body.h88aui-account.logged-in:is(.woocommerce-view-order,.woocommerce-edit-address,.woocommerce-edit-account) #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .ap-mod{background:#fff;border-radius:6px;box-shadow:var(--ap-e1)}
html body.h88aui-account.logged-in:is(.woocommerce-view-order,.woocommerce-edit-address,.woocommerce-edit-account) #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88ap-ph{color:var(--ap-muted)}
html body.h88aui-account.logged-in:is(.woocommerce-view-order,.woocommerce-edit-address,.woocommerce-edit-account) #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .woocommerce-Price-currencySymbol{font-size:.72em;font-weight:700;margin-right:1px}
html body.h88aui-account.logged-in:is(.woocommerce-view-order,.woocommerce-edit-address,.woocommerce-edit-account) #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .amount{font-variant-numeric:tabular-nums;white-space:nowrap}
html body.h88aui-account.logged-in:is(.woocommerce-view-order,.woocommerce-edit-address,.woocommerce-edit-account) #main-content .woocommerce-MyAccount-content:not(#h88ap-x) button.button,html body.h88aui-account.logged-in:is(.woocommerce-view-order,.woocommerce-edit-address,.woocommerce-edit-account) #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .button{display:inline-flex!important;align-items:center;justify-content:center;height:40px!important;min-height:0!important;padding:0 20px!important;border:0!important;border-radius:3px!important;background:var(--ap-red)!important;color:#fff!important;font:700 14px/20px var(--ap-font)!important;text-decoration:none!important;box-shadow:none!important;transition:background .12s var(--ap-ease)}
html body.h88aui-account.logged-in:is(.woocommerce-view-order,.woocommerce-edit-address,.woocommerce-edit-account) #main-content .woocommerce-MyAccount-content:not(#h88ap-x) button.button:hover,html body.h88aui-account.logged-in:is(.woocommerce-view-order,.woocommerce-edit-address,.woocommerce-edit-account) #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .button:hover{background:var(--ap-red-7)!important}

/* ===================== ORDER DETAILS (view-order) ===================== */
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x){display:grid!important;grid-template-columns:minmax(0,1fr) 320px;gap:0 16px;align-items:start}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>*{grid-column:1/-1}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>h1.h88aui-page-title,html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.woocommerce-notices-wrapper{grid-row:1}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>p:has(>mark.order-number){grid-row:2}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-track{grid-row:3}
/* [ADD] back link sits inside the title module */
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-backlink{grid-row:1;justify-self:end;align-self:start;display:inline-flex;align-items:center;gap:2px;height:56px;margin:0 20px 0 0!important;font:600 13px/18px var(--ap-font);color:var(--ap-navy6)!important;text-decoration:none!important;position:relative;z-index:1}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-backlink svg{color:var(--ap-red)}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-backlink:hover{color:var(--ap-red)!important}
/* status sentence (core text) as the head of a status card */
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>p:has(>mark.order-number){margin:0!important;padding:22px 24px 16px!important;background:#fff;border-radius:6px 6px 0 0;box-shadow:var(--ap-e1);font:500 15px/24px var(--ap-font)!important;color:var(--ap-text)!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>p:has(>mark.order-number) mark{background:none!important;padding:0!important;font-weight:800;color:var(--ap-ink)}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>p:has(>mark.order-number) mark.order-number{font-size:18px}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>p:has(>mark.order-number) mark.order-status{display:inline-flex;align-items:center;height:24px;padding:0 10px!important;border-radius:999px;background:var(--ap-ice)!important;color:var(--ap-navy)!important;font:700 13px/24px var(--ap-font);vertical-align:1px}
/* [ADD] status track, derived from the order status */
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-track{display:flex;align-items:center;margin:0 0 16px!important;padding:6px 24px 22px!important;background:#fff;border-radius:0 0 6px 6px;box-shadow:var(--ap-e1);list-style:none}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-track li{display:flex;align-items:center;gap:8px;margin:0!important;padding:0!important;list-style:none;font:600 13px/18px var(--ap-font);color:var(--ap-muted)}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-track li+li::before{content:"";width:120px;height:2px;margin:0 14px;border-radius:1px;background:var(--ap-line)}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-track li.is-done+li::before{background:var(--ap-red)}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-track li span{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;border:1.5px solid var(--ap-line);background:#fff;font:700 12px/1 var(--ap-font);color:var(--ap-muted);box-sizing:border-box}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-track li.is-done span{border-color:var(--ap-red);background:var(--ap-red);color:#fff}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-track li:is(.is-current,[aria-current="step"]){color:var(--ap-ink);font-weight:700}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-track li.is-current span{border-color:var(--ap-red);background:var(--ap-red-50);color:var(--ap-red)}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-track b{font-weight:inherit}
/* items module */
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>section.woocommerce-order-details{grid-column:1;grid-row:4;margin:0!important;padding:0!important;background:#fff;border-radius:6px;box-shadow:var(--ap-e1);overflow:hidden}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>section.woocommerce-customer-details{grid-column:2;grid-row:4;margin:0!important;padding:0 20px 20px!important;background:#fff;border-radius:6px;box-shadow:var(--ap-e1)}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) section h2{display:flex!important;align-items:center;gap:10px;height:56px;margin:0!important;padding:0 20px!important;border-bottom:1px solid var(--ap-line2);font:800 18px/24px var(--ap-font)!important;letter-spacing:-.02em!important;color:var(--ap-ink)!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) section h2::before{content:"";flex:none;width:4px;height:18px;border-radius:2px;background:var(--ap-red)}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) section.woocommerce-customer-details h2{margin:0 -20px!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) table.order_details{width:100%!important;margin:0!important;border:0!important;border-collapse:collapse!important;border-radius:0!important;font:500 14px/20px var(--ap-font)}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) table.order_details thead th{padding:10px 20px!important;background:var(--ap-soft)!important;border:0!important;font:700 11px/14px var(--ap-font)!important;letter-spacing:.08em!important;text-transform:uppercase;color:var(--ap-muted)!important;text-align:left}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) table.order_details thead th:last-child,html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) table.order_details td.product-total,html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) table.order_details tfoot td{text-align:right!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) table.order_details tbody td{padding:14px 20px!important;border:0!important;border-top:1px solid var(--ap-line2)!important;vertical-align:middle!important;background:#fff!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) table.order_details td.product-name{display:flex!important;align-items:center;gap:12px}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) table.order_details td.product-name a{font:600 14px/20px var(--ap-font);color:var(--ap-ink)!important;text-decoration:none!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) table.order_details td.product-name a:hover{color:var(--ap-red)!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) table.order_details .product-quantity{display:inline-block;padding:0 6px;border-radius:3px;background:var(--ap-soft);font:600 12px/20px var(--ap-font)!important;color:var(--ap-muted)!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) table.order_details td.product-total{font-weight:700;color:var(--ap-ink)}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88ap-thumb{flex:none;width:56px;height:56px;border:1px solid var(--ap-line2);border-radius:4px;overflow:hidden;background:#fff}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88ap-thumb img{display:block;width:100%;height:100%;object-fit:contain;padding:3px;box-sizing:border-box}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) table.order_details tfoot th,html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) table.order_details tfoot td{padding:10px 20px!important;border:0!important;border-top:1px solid var(--ap-line2)!important;background:#fff!important;font:500 14px/20px var(--ap-font)!important;color:var(--ap-text)!important;text-align:left}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) table.order_details tfoot td{font-weight:700!important;color:var(--ap-ink)!important;text-align:right!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) table.order_details tfoot tr:first-child :is(th,td){border-top:1px solid var(--ap-line)!important;padding-top:14px!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) table.order_details tfoot tr:has(>th[scope=row]):not(:has(~tr>th[scope=row])) th{padding:14px 20px 18px!important;font:700 16px/22px var(--ap-font)!important;color:var(--ap-ink)!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) table.order_details tfoot tr:has(>th[scope=row]):not(:has(~tr>th[scope=row])) td{padding:14px 20px 18px!important;font:800 24px/28px var(--ap-font)!important;letter-spacing:-.03em;color:var(--ap-red)!important}
/* billing card: one left edge, icon column */
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) section.woocommerce-customer-details address{position:relative;margin:16px 0 0!important;padding:0 0 0 26px!important;border:0!important;font:500 14px/22px var(--ap-font)!important;font-style:normal!important;color:var(--ap-text)!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) section.woocommerce-customer-details address::before{content:"";position:absolute;left:0;top:3px;width:16px;height:16px;background:center/16px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2367707b' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-6.2-7-11.5A7 7 0 0 1 19 9.5C19 14.8 12 21 12 21z'/%3E%3Ccircle cx='12' cy='9.5' r='2.5'/%3E%3C/svg%3E")}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) section.woocommerce-customer-details address p{position:relative;margin:10px 0 0!important;padding:0!important;font:500 14px/22px var(--ap-font)!important;color:var(--ap-text)!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) section.woocommerce-customer-details address p::before{content:""!important;position:absolute;left:-26px;top:3px;width:16px;height:16px;margin:0!important;background:center/16px no-repeat}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) section.woocommerce-customer-details address p.woocommerce-customer-details--phone::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2367707b' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2'/%3E%3C/svg%3E")}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) section.woocommerce-customer-details address p.woocommerce-customer-details--email::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2367707b' 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")}
/* [ADD] order help strip */
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-orderhelp{grid-row:5;display:grid;grid-template-columns:repeat(3,1fr);margin:16px 0 0!important;background:#fff;border-radius:6px;box-shadow:var(--ap-e1);overflow:hidden}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-orderhelp a{display:flex;align-items:center;gap:12px;padding:18px 20px;text-decoration:none!important;color:var(--ap-ink)!important;transition:background .12s var(--ap-ease)}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-orderhelp a+a{border-left:1px solid var(--ap-line2)}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-orderhelp a:hover{background:var(--ap-soft)}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-orderhelp svg{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.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-orderhelp a:last-child svg{background:var(--ap-red-50);color:var(--ap-red)}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-orderhelp b{display:block;font:700 14px/20px var(--ap-font)}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-orderhelp em{display:block;font:500 12px/16px var(--ap-font);font-style:normal;color:var(--ap-muted)}

/* ===================== ADDRESSES (88hardware-address-book-v1) ===================== */
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-address-book{display:grid!important;grid-template-columns:1fr 1fr;gap:16px;margin:0!important;padding:0!important;border:0!important;background:transparent!important}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-address-book>*{grid-column:1/-1}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-heading{display:flex!important;align-items:center;gap:10px;height:56px;margin:0!important;padding:0 12px 0 20px!important;background:#fff;border:0!important;border-radius:6px;box-shadow:var(--ap-e1)}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-heading h2{display:flex;align-items:center;gap:10px;margin:0!important;font:800 20px/26px var(--ap-font)!important;letter-spacing:-.02em!important;color:var(--ap-ink)!important}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-heading h2::before{content:"";flex:none;width:4px;height:20px;border-radius:2px;background:var(--ap-red)}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-heading .button{margin-left:auto!important;height:36px!important;padding:0 16px!important;font-size:13px!important}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-row{grid-column:auto;display:flex!important;flex-direction:column;justify-content:space-between;min-height:188px;margin:0!important;padding:20px!important;background:#fff;border:1px solid transparent!important;border-radius:6px!important;box-shadow:var(--ap-e1);box-sizing:border-box;position:relative}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-row:has(.h88-ab-badge){border-color:#f3c2c8!important;box-shadow:inset 0 3px 0 var(--ap-red),var(--ap-e1)}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-details{display:block!important;margin:0!important;padding:0 0 0 52px!important;position:relative;font:500 14px/22px var(--ap-font);color:var(--ap-text)}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-details::before{content:"";position:absolute;left:0;top:0;width:40px;height:40px;border-radius:12px;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%3Cpath d='M12 21s-7-6.2-7-11.5a7 7 0 0 1 14 0C19 14.8 12 21 12 21z'/%3E%3Ccircle cx='12' cy='9.5' r='2.5'/%3E%3C/svg%3E") center/20px no-repeat}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-details>strong{display:inline;font:700 16px/22px var(--ap-font)!important;color:var(--ap-ink)!important}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-details>strong .h88ap-ph{color:var(--ap-ink)}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-phone{display:inline;margin-left:8px;padding-left:9px;border-left:1px solid var(--ap-line);font:500 14px/22px var(--ap-font)!important;color:var(--ap-muted)!important}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-details>p{margin:6px 0 0!important;font:500 14px/22px var(--ap-font)!important;color:var(--ap-text)!important}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-badge{position:absolute;right:0;top:0;display:inline-flex!important;align-items:center;height:22px;margin:0!important;padding:0 8px!important;border:0!important;border-radius:3px!important;background:var(--ap-red)!important;color:#fff!important;font:800 11px/22px var(--ap-font)!important;letter-spacing:.06em;text-transform:uppercase}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-import-note{display:block;margin-top:8px;font:500 12px/16px var(--ap-font);color:var(--ap-muted)}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-actions{display:flex!important;align-items:center;gap:4px;margin:16px 0 0!important;padding:12px 0 0 52px!important;border-top:1px solid var(--ap-line2)}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-actions :is(a,button){display:inline-flex!important;align-items:center;height:32px!important;padding:0 10px!important;border:0!important;border-radius:3px!important;background:none!important;font:600 13px/18px var(--ap-font)!important;color:var(--ap-navy6)!important;text-decoration:none!important;cursor:pointer;box-shadow:none!important}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-actions :is(a,button):hover{background:var(--ap-soft)!important;color:var(--ap-red)!important}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-actions a{margin-left:-10px!important}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-actions button[value=delete]{color:var(--ap-muted)!important}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-actions .h88-ab-set-default{margin-left:auto!important;border:1px solid var(--ap-red)!important;color:var(--ap-red)!important}
/* [ADD] add-address tile */
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88ap-addtile{grid-column:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:188px;border:1.5px dashed #c9ced6;border-radius:6px;background:rgba(255,255,255,.6);text-decoration:none!important;text-align:center;transition:border-color .12s var(--ap-ease),background .12s var(--ap-ease)}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88ap-addtile:hover{border-color:var(--ap-red);background:#fff}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88ap-addtile span{display:grid;place-items:center;width:40px;height:40px;margin-bottom:6px;border-radius:50%;background:var(--ap-red-50);font:500 26px/1 var(--ap-font);color:var(--ap-red)}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88ap-addtile b{font:700 15px/20px var(--ap-font);color:var(--ap-ink)}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88ap-addtile em{font:500 12px/16px var(--ap-font);font-style:normal;color:var(--ap-muted)}
/* empty state ("No saved addresses yet.") */
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-address-book>p:not(.h88-ab-note,.h88ap-empty-cta){display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:220px;margin:0!important;padding:28px!important;background:#fff;border-radius:6px;box-shadow:var(--ap-e1);font:700 16px/22px var(--ap-font)!important;color:var(--ap-ink)!important}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-address-book>p:not(.h88-ab-note,.h88ap-empty-cta)::before{content:"";width:64px;height:64px;border-radius:50%;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.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-6.2-7-11.5a7 7 0 0 1 14 0C19 14.8 12 21 12 21z'/%3E%3Ccircle cx='12' cy='9.5' r='2.5'/%3E%3C/svg%3E") center/30px no-repeat}
/* note */
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-note{display:flex;align-items:flex-start;gap:10px;margin:0!important;padding:14px 16px!important;border-radius:6px;background:var(--ap-ice);font:500 13px/19px var(--ap-font)!important;color:var(--ap-navy)!important}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-note::before{content:"";flex:none;width:18px;height:18px;margin-top:1px;background:center/18px no-repeat 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%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 11v5.5M12 7.6v.2'/%3E%3C/svg%3E")}
/* editor (?address=new / ?address=<id>) */
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-editor{display:grid!important;grid-template-columns:1fr 1fr;column-gap:16px;margin:0!important;padding:0 24px 24px!important;background:#fff;border:0!important;border-radius:6px;box-shadow:var(--ap-e1)}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-editor h3{grid-column:1/-1;display:flex;align-items:center;gap:10px;height:56px;margin:0 -24px 20px!important;padding:0 24px!important;border-bottom:1px solid var(--ap-line2);font:800 18px/24px var(--ap-font)!important;letter-spacing:-.02em;color:var(--ap-ink)!important}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-editor h3::before{content:"";flex:none;width:4px;height:18px;border-radius:2px;background:var(--ap-red)}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-editor .form-row{float:none!important;width:auto!important;margin:0 0 16px!important;padding:0!important;grid-column:auto}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-editor .form-row-wide{grid-column:1/-1}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-editor #h88_address_company_field{grid-column:1/-1}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-editor #h88_address_address_1_field{grid-column:1/-1;margin-bottom:8px!important}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-editor #h88_address_address_2_field{grid-column:1/-1}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-editor #h88_address_city_field,html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-editor #h88_address_state_field,html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-editor #h88_address_postcode_field,html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-editor #h88_address_phone_field,html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-editor #h88_address_country_field{grid-column:auto}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-editor .woocommerce-input-wrapper{display:block}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-editor-actions{grid-column:1/-1;display:flex!important;align-items:center;gap:16px;margin:8px -24px -24px!important;padding:16px 24px!important;border-top:1px solid var(--ap-line2);background:var(--ap-soft);border-radius:0 0 6px 6px}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-editor-actions a{font:600 14px/20px var(--ap-font);color:var(--ap-navy6)!important;text-decoration:none!important}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-editor-actions a:hover{color:var(--ap-red)!important}

/* ===================== ACCOUNT DETAILS (edit-account) ===================== */
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) form.woocommerce-EditAccountForm{display:grid!important;grid-template-columns:1fr 1fr;column-gap:16px;margin:0!important;padding:24px 24px 0!important;background:#fff;border-radius:6px;box-shadow:var(--ap-e1);position:relative}
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) form.woocommerce-EditAccountForm::before{content:"Personal details";grid-column:1/-1;display:flex;align-items:center;margin:0 0 16px;font:700 13px/18px var(--ap-font);letter-spacing:.08em;text-transform:uppercase;color:var(--ap-muted)}
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) form.woocommerce-EditAccountForm>.clear{display:none!important}
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) form.woocommerce-EditAccountForm .form-row{float:none!important;width:auto!important;margin:0 0 18px!important;padding:0!important}
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) form.woocommerce-EditAccountForm>.form-row-wide{grid-column:1/-1}
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) form.woocommerce-EditAccountForm #account_display_name_description{display:block;margin-top:6px;font:500 12px/16px var(--ap-font);color:var(--ap-muted)}
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) form.woocommerce-EditAccountForm #account_display_name_description em{font-style:normal}
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) form.woocommerce-EditAccountForm fieldset{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;column-gap:16px;margin:8px -24px 0!important;padding:24px 24px 6px!important;border:0!important;border-top:1px solid var(--ap-line2)!important;border-radius:0!important;min-width:0}
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) form.woocommerce-EditAccountForm legend{float:left;grid-column:1/-1;display:flex;align-items:center;gap:8px;width:100%;margin:0 0 16px!important;padding:0!important;font:700 13px/18px var(--ap-font)!important;letter-spacing:.08em;text-transform:uppercase;color:var(--ap-muted)!important}
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) form.woocommerce-EditAccountForm legend::before{content:"";width:16px;height:16px;background:center/16px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2367707b' 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%3C/svg%3E")}
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) form.woocommerce-EditAccountForm fieldset>.form-row:first-of-type{grid-column:1/-1;max-width:calc(50% - 8px)}
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .password-input,html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword .password-input{display:block;position:relative}
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .password-input input,html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword .password-input input{padding-right:44px!important}
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .show-password-input,html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword .show-password-input{position:absolute!important;right:4px;top:4px;width:36px;height:36px;padding:0!important;border:0!important;border-radius:3px;background:center/18px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2367707b' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.6-7 10-7 10 7 10 7-3.6 7-10 7S2 12 2 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E")!important;cursor:pointer}
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .show-password-input::after,html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword .show-password-input::after{display:none!important}
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .show-password-input:hover,html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword .show-password-input:hover{background-color:var(--ap-soft)!important}
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) form.woocommerce-EditAccountForm>p:last-child{grid-column:1/-1;display:flex;align-items:center;gap:16px;margin:0 -24px!important;padding:16px 24px!important;border-top:1px solid var(--ap-line2);background:var(--ap-soft);border-radius:0 0 6px 6px}
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) form.woocommerce-EditAccountForm>p:last-child .button{min-width:180px}
}
@media (min-width:1200px) and (hover:hover) and (pointer:fine){
/* fixes: the account UI visually hides duplicate titles (1px clip); on these pages they are the module titles */
html body.h88aui-account.logged-in:is(.woocommerce-view-order,.woocommerce-edit-address,.woocommerce-edit-account) #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>h1.h88aui-page-title,html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-heading h2{height:auto!important;min-height:0!important;width:auto!important;clip:auto!important;clip-path:none!important;overflow:visible!important;position:static!important;white-space:nowrap!important;margin-top:0!important}
html body.h88aui-account.logged-in:is(.woocommerce-view-order,.woocommerce-edit-address,.woocommerce-edit-account) #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>h1.h88aui-page-title{height:56px!important}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>h1.h88aui-page-title{display:block!important;position:absolute!important;width:1px!important;height:1px!important;min-height:0!important;margin:0!important;padding:0!important;border:0!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;white-space:nowrap!important} /* addresses: "My Addresses" header is the title module */
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-row{display:flex!important;flex-direction:column!important}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-actions{flex-direction:row!important;align-self:stretch!important;width:auto!important;height:auto!important;justify-content:flex-start!important}
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .show-password-input::before,html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword .show-password-input::before{display:none!important;content:none!important}
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) form.woocommerce-EditAccountForm>p:last-child{background:#fff!important}
}
@media (min-width:1200px) and (hover:hover) and (pointer:fine){
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-row{align-items:stretch!important;justify-content:flex-start!important;gap:0!important;min-height:188px}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-details{width:auto!important;flex:none!important}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-actions{min-height:0!important;flex:none!important;margin-top:auto!important;align-items:center!important;flex-wrap:nowrap!important}
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .show-password-input,html body.woocommerce-lost-password #main-content>article .woocommerce-ResetPassword .show-password-input{top:5px!important;margin:0!important;transform:none!important}
}
@media (min-width:1200px) and (hover:hover) and (pointer:fine){
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .product-quantity{white-space:nowrap!important}
}

/* ===================== v2 (critique AP1–AP8, 2026-10-21) ===================== */
@media (min-width:1200px) and (hover:hover) and (pointer:fine){
/* AP1 auth canvas: one #f3f4f6 canvas, full height; nav bar runs under the tool-rail lane to the viewport edge */
html body.h88-auth-page-active,html body.h88-auth-page-active .h88-auth-page,html body.h88-auth-page-active #main-content{background:#f3f4f6!important}
html body.h88-auth-page-active .h88-auth-page{min-height:100vh!important;box-sizing:border-box}
html body.h88-auth-page-active .h88-auth-page-nav{margin-right:calc(0px - var(--h88-tool-rail-lane,0px))!important;padding:0 calc(max(40px,(100% - 1080px)/2) + var(--h88-tool-rail-lane,0px)) 0 max(40px,calc((100% - 1080px)/2))!important}
/* AP3 Forgot password? on the Stay signed in row (order only, DOM unchanged) */
html body.h88-auth-page-active .h88-auth-page-panel[data-h88-auth-panel="login"] .h88-auth-form{display:flex!important;flex-wrap:wrap;align-items:center}
html body.h88-auth-page-active .h88-auth-page-panel[data-h88-auth-panel="login"] .h88-auth-form>*{flex:0 0 100%;min-width:0}
html body.h88-auth-page-active .h88-auth-page-panel[data-h88-auth-panel="login"] .h88-auth-form>.h88-auth-remember{order:3;flex:1 1 auto!important;width:auto!important;margin:0 0 20px!important}
html body.h88-auth-page-active .h88-auth-layout .h88-auth-surface .h88-auth-page-panel[data-h88-auth-panel="login"] .h88-auth-form>p.h88-auth-forgot{order:4;flex:0 0 auto!important;width:auto!important;max-width:50%;margin:0 0 20px auto!important;line-height:24px!important;text-align:right}
html body.h88-auth-page-active .h88-auth-page-panel[data-h88-auth-panel="login"] .h88-auth-form>.h88-auth-submit{order:5}
html body.h88-auth-page-active .h88-auth-page-panel[data-h88-auth-panel="login"] .h88-auth-form>.h88-auth-forgot~*:not(.h88-auth-submit){order:6}
html body.h88-auth-page-active .h88-auth-page-panel[data-h88-auth-panel="login"] .h88-auth-form>.h88-auth-remember~input[type=hidden]{order:2}
/* AP5 required mark on Create / Confirm password (both fields are required in the live form) */
html body.h88-auth-page-active .h88-auth-surface .h88-auth-form label:is([for$="-register-password"],[for$="-register-confirm"])::after{content:" *";color:#cf172d;font-weight:600}
/* AP6 note directly under the photo */
html body.h88-auth-page-active .h88-auth-promotion-note{margin:16px 0 0!important}
}
@media (min-width:1200px) and (hover:hover) and (pointer:fine){
/* AP7 "(leave blank to leave unchanged)" muted regular. The label text is one escaped core string, so the visible
   label is drawn from two pseudo parts; the real label text stays in the DOM for screen readers. */
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) label:is([for="password_current"],[for="password_1"]){font-size:0!important;line-height:0!important}
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) label[for="password_current"]::before{content:"Current password"}
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) label[for="password_1"]::before{content:"New password"}
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) label:is([for="password_current"],[for="password_1"])::before{font:600 13px/18px Inter,system-ui,sans-serif;color:#181c22}
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) label:is([for="password_current"],[for="password_1"])::after{content:" (leave blank to leave unchanged)";font:400 13px/18px Inter,system-ui,sans-serif;color:#67707b}
html body.h88aui-account.logged-in.woocommerce-edit-account #main-content .woocommerce-MyAccount-content:not(#h88ap-x) label:is([for="password_current"],[for="password_1"]){display:block!important;height:18px;margin-bottom:6px!important}
/* AP8 editor: no "+ Add Address" while the form is open; Country / State get the checkout chevron */
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-address-book:has(.h88-ab-editor) .h88-ab-heading .button{display:none!important}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-address-book:has(.h88-ab-editor) .h88-ab-heading{min-height:56px}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-ab-editor select{appearance:none!important;-webkit-appearance:none!important;padding:0 36px 0 12px!important;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2367707b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right 12px center/16px no-repeat!important}
}

/* ===================== build additions (2026-10-22): live-markup glue, no new look ===================== */
@media (min-width:1200px) and (hover:hover) and (pointer:fine){
/* PC copy swaps (AP2 "Items", AP4 register intro): the off-PC copy is kept in the markup and hidden here */
[data-h88ap="pc-hide"]{display:none!important}
/* order statuses without the progress track (pending, on-hold, cancelled, refunded, failed): the status card closes on its own */
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x):not(:has(>.h88ap-track,>.h88ap-next))>p:has(>mark.order-number){border-radius:6px;margin:0 0 16px!important;padding-bottom:22px!important}
/* orders that also print a shipping address (core order-details-customer.php two-column variant, not drawn in the mockup):
   stack Billing / Shipping inside the same 320px card using the card's own title style, instead of two squeezed columns */
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) section.woocommerce-customer-details .woocommerce-columns--addresses{display:block!important;margin:0!important;padding:0!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) section.woocommerce-customer-details .woocommerce-column{float:none!important;width:auto!important;max-width:none!important;margin:0!important;padding:0!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) section.woocommerce-customer-details .woocommerce-column--2{margin-top:20px!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) section.woocommerce-customer-details .woocommerce-column--2 h2{border-top:1px solid var(--ap-line2)}
/* r2 (UI answers 2026-10-22) (a) order notes as a v2 card before the help strip. r3 AP18: styles the PC copy printed at
   woocommerce_view_order 15 ("Order notes", data-h88ap="addition"); the core block before the table is pc-hide on PC */
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>h2[data-h88ap="addition"]:has(+ol.woocommerce-OrderUpdates){grid-row:5;display:flex!important;align-items:center;gap:10px;height:56px;margin:16px 0 0!important;padding:0 20px!important;background:#fff;border-bottom:1px solid var(--ap-line2);border-radius:6px 6px 0 0;box-shadow:var(--ap-e1);font:800 18px/24px var(--ap-font)!important;letter-spacing:-.02em!important;color:var(--ap-ink)!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>h2[data-h88ap="addition"]:has(+ol.woocommerce-OrderUpdates)::before{content:"";flex:none;width:4px;height:18px;border-radius:2px;background:var(--ap-red)}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>ol.woocommerce-OrderUpdates[data-h88ap="addition"]{grid-row:6;margin:0!important;padding:0 20px!important;list-style:none!important;background:#fff;border:0!important;border-radius:0 0 6px 6px;box-shadow:var(--ap-e1)}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>ol.woocommerce-OrderUpdates[data-h88ap="addition"]>li{margin:0!important;padding:14px 0!important;list-style:none!important;border:0!important;border-top:1px solid var(--ap-line2)!important;background:none!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>ol.woocommerce-OrderUpdates[data-h88ap="addition"]>li:first-child{border-top:0!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>ol.woocommerce-OrderUpdates[data-h88ap="addition"] :is(.woocommerce-OrderUpdate-inner,.woocommerce-OrderUpdate-text){margin:0!important;padding:0!important;border:0!important;background:none!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>ol.woocommerce-OrderUpdates[data-h88ap="addition"] .clear{display:none!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>ol.woocommerce-OrderUpdates[data-h88ap="addition"] p.woocommerce-OrderUpdate-meta{margin:0 0 4px!important;font:600 12px/16px var(--ap-font)!important;color:var(--ap-muted)!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>ol.woocommerce-OrderUpdates[data-h88ap="addition"] .woocommerce-OrderUpdate-description,html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>ol.woocommerce-OrderUpdates[data-h88ap="addition"] .woocommerce-OrderUpdate-description p{margin:0!important;font:500 14px/22px var(--ap-font)!important;color:var(--ap-text)!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x):has(.woocommerce-column--shipping-address):has(>ol.woocommerce-OrderUpdates[data-h88ap="addition"])>.h88ap-orderhelp{grid-row:7}
/* (b) unpaid orders: core Actions row (Pay / Cancel) keeps its functions; Pay = primary red, others = secondary outline (v2 line button) */
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) table.order_details tfoot .order-actions-button:not(.pay){background:#fff!important;color:var(--ap-red)!important;border:1px solid var(--ap-red)!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) table.order_details tfoot .order-actions-button:not(.pay):hover{background:var(--ap-red-50)!important}
/* (c) item without a product image: light grey square, 88 badge (theme asset already loaded by the tool rail) at 40 % */
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88ap-thumb--none{display:grid;place-items:center;background:var(--ap-bg)}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88ap-thumb--none::before{content:"";width:28px;height:28px;background:center/contain no-repeat url("/wp-content/themes/88hardware-club/assets/images/home-logo-2b7bce180b0e.png");opacity:.4}
}
@media (min-width:1200px) and (hover:hover) and (pointer:fine){
/* ===== r3 ===== */
/* AP9 unpaid: Actions row = right-aligned button bar, Pay is the widest. Build note: the critique's display:flex <tr> drops into
   the first table column (anonymous cell) and collapses the totals column, so the same bar is drawn by the <td> positioned over
   the whole row; the "Actions:" <th> keeps the row height and stays in the accessibility tree (text at font-size 0). */
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) table.order_details tfoot tr:has(>th.order-actions--heading){position:relative}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) table.order_details tfoot tr:has(>th.order-actions--heading)>th{height:76px;padding:0!important;border:0!important;font-size:0!important;line-height:0!important;color:transparent!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) table.order_details tfoot tr:has(>th.order-actions--heading)>td{position:absolute!important;inset:0;display:flex!important;align-items:center;justify-content:flex-end;gap:12px;padding:16px 20px!important;border:0!important;border-top:1px solid var(--ap-line2)!important;background:#fff!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) table.order_details tfoot .order-actions-button{margin:0!important;display:inline-flex!important;align-items:center;justify-content:center;height:44px!important;min-width:132px;padding:0 20px!important;border-radius:3px!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x) table.order_details tfoot .order-actions-button.pay{min-width:160px}
/* AP10 pending / on-hold: yellow status pill + next-step row in the status card (row 3, where the track sits); closed statuses muted */
html body.h88aui-account.logged-in.woocommerce-view-order:is(.h88ap-order-pending,.h88ap-order-on-hold) #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>p:has(>mark.order-number) mark.order-status{background:var(--ap-y-50)!important;color:var(--ap-y-ink)!important;box-shadow:inset 0 0 0 1px var(--ap-y)}
html body.h88aui-account.logged-in.woocommerce-view-order:is(.h88ap-order-cancelled,.h88ap-order-failed,.h88ap-order-refunded) #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>p:has(>mark.order-number) mark.order-status{background:var(--ap-soft)!important;color:var(--ap-muted)!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-next{grid-row:3;margin:0 0 16px!important;padding:12px 20px 16px;background:#fff;border-radius:0 0 6px 6px;box-shadow:var(--ap-e1)}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-next .h88ap-next-in{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:44px;padding:12px 16px;border-radius:6px;background:var(--ap-y-50);border-left:4px solid var(--ap-y);font:600 14px/20px var(--ap-font);color:var(--ap-y-ink)}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-next p{margin:0!important;padding:0!important;font:inherit!important;color:inherit!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-next .button{flex:none;display:inline-flex!important;align-items:center;justify-content:center;height:44px!important;min-width:140px;margin:0!important;padding:0 20px!important;border:0!important;border-radius:3px!important;background:var(--ap-red)!important;color:#fff!important;font:700 14px/1 var(--ap-font)!important;text-decoration:none!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-next .button:hover{background:var(--ap-red-7)!important}
/* AP11 empty address book: the action sits inside the empty card (two paragraphs drawn as one card) */
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-address-book>p:not(.h88-ab-note,.h88ap-empty-cta):has(+.h88ap-empty-cta){min-height:0!important;padding-bottom:8px!important;border-radius:6px 6px 0 0!important;clip-path:inset(-12px -12px 0 -12px)}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-address-book>.h88ap-empty-cta{display:flex;flex-direction:column;align-items:center;gap:14px;margin:-16px 0 0!important;padding:0 28px 28px!important;background:#fff;border-radius:0 0 6px 6px;box-shadow:var(--ap-e1);clip-path:inset(0 -12px -12px -12px);font:500 14px/20px var(--ap-font)!important;color:var(--ap-muted)!important;text-align:center}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-address-book>.h88ap-empty-cta .button{display:inline-flex!important;align-items:center;justify-content:center;height:44px!important;margin:0!important;padding:0 24px!important;border:0!important;border-radius:3px!important;background:var(--ap-red)!important;color:#fff!important;font:700 14px/1 var(--ap-font)!important;text-decoration:none!important}
html body.h88aui-account.logged-in.woocommerce-edit-address #main-content .woocommerce-MyAccount-content:not(#h88ap-x) .h88-address-book>.h88ap-empty-cta .button:hover{background:var(--ap-red-7)!important}
/* AP12 login / register: no 240px empty band under the auth card */
html body.h88-auth-page-active .h88-footer-space{display:none!important}
/* AP13 chat unread dot (added by the chat JS) on the icon tile corner, not mid-row */
html body.woocommerce-lost-password #main-content>article .h88ap-help li a[data-h88-chat-open]{position:relative}
html body.woocommerce-lost-password #main-content>article .h88ap-help li a[data-h88-chat-open] .h88-chat-unread{top:8px;right:auto;left:44px}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-orderhelp a[data-h88-chat-open]{position:relative}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x)>.h88ap-orderhelp a[data-h88-chat-open] .h88-chat-unread{top:14px;right:auto;left:53px}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x):not(:has(.woocommerce-column--shipping-address))>.h88ap-orderhelp a[data-h88-chat-open] .h88-chat-unread{top:8px}
/* AP14 notices focused by WooCommerce on load: no browser focus box (role="alert" still announces them) */
html body:is(.woocommerce-lost-password,.h88-auth-page-active) :is(.woocommerce-message,.woocommerce-error,.woocommerce-info)[tabindex="-1"]:focus{outline:none!important}
/* AP19 single-address orders: help links in the right column directly under Billing (items card spans rows 4-5, row 5 is the
   flexible one, so Billing keeps its own height); with a shipping
   address the full-width strip stays (rows 5, or 7 after the notes) */
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x):not(:has(.woocommerce-column--shipping-address)){grid-template-rows:auto auto auto auto 1fr}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x):not(:has(.woocommerce-column--shipping-address))>section.woocommerce-order-details{grid-row:4/span 2}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x):not(:has(.woocommerce-column--shipping-address))>.h88ap-orderhelp{grid-row:5;grid-column:2;display:flex;flex-direction:column;margin:16px 0 0!important}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x):not(:has(.woocommerce-column--shipping-address))>.h88ap-orderhelp a{height:64px;padding:0 20px;box-sizing:border-box}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x):not(:has(.woocommerce-column--shipping-address))>.h88ap-orderhelp a+a{border-left:0;border-top:1px solid var(--ap-line2)}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x):not(:has(.woocommerce-column--shipping-address))>h2[data-h88ap="addition"]:has(+ol.woocommerce-OrderUpdates){grid-row:6}
html body.h88aui-account.logged-in.woocommerce-view-order #main-content .woocommerce-MyAccount-content:not(#h88ap-x):not(:has(.woocommerce-column--shipping-address))>ol.woocommerce-OrderUpdates[data-h88ap="addition"]{grid-row:7}
/* AP22 logged-in content: the same v2 focus ring as the auth pages */
html body.h88aui-account.logged-in #main-content .woocommerce-MyAccount-content:not(#h88ap-x) :is(a,button):focus-visible{outline:2px solid var(--ap-navy)!important;outline-offset:2px!important}
}

/* Non-visual: display-only additions take no space off PC, so phone / tablet / touch render exactly as before. */
@media not all and (min-width:1200px) and (hover:hover) and (pointer:fine){
[data-h88ap="addition"]{display:none!important}
}

/* AP24 (2026-10-22): lost-password content controls use the v2 2px navy focus ring. PC only. */
@media (min-width:1200px) and (hover:hover) and (pointer:fine){
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}
}