/* MW order tracking page (owner 2026-10-26). Rendered by track.js into on each store's /pages/track-order.
   Colours and fonts come from the store's theme at runtime (track.js sets the --mt-* tokens). */
#mw-track{--mt-fg:#1a1a1a;--mt-bg:#fff;--mt-accent:#111;--mt-accent-fg:#fff;--mt-font:inherit;--mt-head:inherit;
  --mt-muted:color-mix(in srgb,var(--mt-fg) 58%,transparent);--mt-line:color-mix(in srgb,var(--mt-fg) 12%,transparent);
  --mt-soft:color-mix(in srgb,var(--mt-fg) 4%,var(--mt-bg));--mt-tint:color-mix(in srgb,var(--mt-accent) 10%,var(--mt-bg));
  --mt-ok:#1f9d55;--mt-r:18px;--mt-card:color-mix(in srgb,var(--mt-bg) 35%,#fff);}
#mw-track .mt{
  max-width:640px;margin:0 auto;padding:28px 16px 64px;color:var(--mt-fg);font-family:var(--mt-font);
  -webkit-font-smoothing:antialiased;box-sizing:border-box;text-align:left}
#mw-track .mt *,#mw-track .mt *::before,#mw-track .mt *::after{box-sizing:border-box}
#mw-track .mt h1,#mw-track .mt h2,#mw-track .mt h3{font-family:var(--mt-head);margin:0;color:var(--mt-fg);letter-spacing:-.01em}
#mw-track .mt-eyebrow{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--mt-muted);font-weight:600;margin:0 0 8px}
#mw-track .mt-head h1{font-size:clamp(28px,7vw,40px);line-height:1.05}
#mw-track .mt-head p{margin:10px 0 22px;color:var(--mt-muted);font-size:15px;line-height:1.5}

/* cards */
#mw-track .mt-card{background:var(--mt-card);border:1px solid var(--mt-line);border-radius:var(--mt-r);padding:18px;
  box-shadow:0 1px 2px color-mix(in srgb,var(--mt-fg) 6%,transparent),0 12px 32px -18px color-mix(in srgb,var(--mt-fg) 30%,transparent)}
#mw-track .mt-card+.mt-card{margin-top:14px}

/* search */
#mw-track .mt-seg{position:relative;display:grid;grid-template-columns:1fr 1fr;background:var(--mt-soft);border-radius:999px;padding:4px;margin-bottom:16px}
#mw-track .mt-seg button{position:relative;z-index:1;border:0;background:none;font:600 14px/1 var(--mt-font);color:var(--mt-muted);padding:11px 8px;
  border-radius:999px;cursor:pointer;transition:color .2s}
#mw-track .mt-seg button[aria-pressed=true]{color:var(--mt-fg)}
#mw-track .mt-seg i{position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);border-radius:999px;background:var(--mt-card);
  box-shadow:0 1px 3px color-mix(in srgb,var(--mt-fg) 18%,transparent);transition:transform .35s cubic-bezier(.3,1.3,.5,1)}
#mw-track .mt-seg.n i{transform:translateX(100%)}
#mw-track .mt-field{position:relative;margin-bottom:12px}
#mw-track .mt-field input{width:100%;height:56px;border:1.5px solid var(--mt-line);border-radius:14px;background:var(--mt-card);color:var(--mt-fg);
  font:16px var(--mt-font);padding:22px 14px 6px;outline:none;transition:border-color .2s,box-shadow .2s;-webkit-appearance:none;margin:0}
#mw-track .mt-field label{position:absolute;left:15px;top:18px;font-size:15px;color:var(--mt-muted);pointer-events:none;transition:all .18s ease}
#mw-track .mt-field input:focus{border-color:var(--mt-accent);box-shadow:0 0 0 4px var(--mt-tint)}
#mw-track .mt-field input:focus+label,#mw-track .mt-field input:not(:placeholder-shown)+label{top:8px;font-size:11px;letter-spacing:.04em}
#mw-track .mt-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:54px;border:0;border-radius:14px;cursor:pointer;
  background:var(--mt-accent);color:var(--mt-accent-fg);font:600 16px var(--mt-font);transition:transform .12s,filter .2s}
#mw-track .mt-btn:active{transform:scale(.98)}
#mw-track .mt-btn:hover{filter:brightness(1.08)}
#mw-track .mt-btn[disabled]{opacity:.7;cursor:progress}
#mw-track .mt-btn svg{width:18px;height:18px}
#mw-track .mt-err{color:#c0392b;font-size:14px;margin:12px 2px 0;min-height:1em}
#mw-track .mt-shake{animation:mtShake .42s}
@keyframes mtShake{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
#mw-track .mt-hint{font-size:13px;color:var(--mt-muted);margin:14px 2px 0;line-height:1.45}

/* result */
#mw-track .mt-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px;font-size:14px;color:var(--mt-muted)}
#mw-track .mt-bar b{color:var(--mt-fg);font-weight:600}
#mw-track .mt-link{white-space:nowrap;background:none;border:0;padding:0;color:var(--mt-fg);font:600 14px var(--mt-font);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
#mw-track .mt-hero{position:relative;overflow:hidden}
#mw-track .mt-hero .mt-status{font-family:var(--mt-head);font-weight:700;letter-spacing:-.015em;color:var(--mt-fg);font-size:clamp(34px,10vw,48px);line-height:1;margin:2px 0 8px}
#mw-track .mt-hero .mt-sub{color:var(--mt-muted);font-size:15px;line-height:1.45;margin:0}
#mw-track .mt-hero.ok .mt-status{color:var(--mt-ok)}
#mw-track .mt-chips{display:flex;gap:8px;overflow-x:auto;margin:0 0 14px;padding-bottom:2px;scrollbar-width:none}
#mw-track .mt-chips button{flex:none;border:1.5px solid var(--mt-line);background:var(--mt-bg);color:var(--mt-fg);border-radius:999px;padding:8px 14px;
  font:600 13px var(--mt-font);cursor:pointer}
#mw-track .mt-chips button[aria-pressed=true]{border-color:var(--mt-accent);background:var(--mt-tint)}

/* milestone track */
#mw-track .mt-track{position:relative;margin:26px 0 4px;padding-top:30px}
#mw-track .mt-rail{position:absolute;left:calc(100%/12);right:calc(100%/12);top:39px;height:4px;border-radius:4px;background:var(--mt-line);overflow:hidden}
#mw-track .mt-fill{position:absolute;inset:0;transform-origin:left center;transform:scaleX(0);background:var(--mt-accent);border-radius:4px}
#mw-track .mt-steps{position:relative;display:grid;grid-template-columns:repeat(6,1fr);list-style:none;margin:0;padding:0}
#mw-track .mt-steps li{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;min-width:0}
#mw-track .mt-dot{position:relative;width:22px;height:22px;border-radius:50%;background:var(--mt-bg);border:2px solid var(--mt-line);display:grid;place-items:center;
  transition:background .3s,border-color .3s}
#mw-track .mt-dot svg{width:12px;height:12px;opacity:0;transform:scale(.4);transition:all .3s .1s;color:var(--mt-accent-fg)}
#mw-track .mt-steps li.done .mt-dot{background:var(--mt-accent);border-color:var(--mt-accent)}
#mw-track .mt-steps li.done .mt-dot svg{opacity:1;transform:none}
#mw-track .mt-steps li.now .mt-dot::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid var(--mt-accent);animation:mtPulse 1.8s ease-out infinite}
@keyframes mtPulse{0%{transform:scale(.7);opacity:.9}100%{transform:scale(1.6);opacity:0}}
#mw-track .mt-lbl{font-size:11.5px;line-height:1.25;color:var(--mt-muted);font-weight:500;white-space:nowrap}
#mw-track .mt-steps li.done .mt-lbl{color:var(--mt-fg)}
#mw-track .mt-steps li.now .mt-lbl{color:var(--mt-fg);font-weight:700}
#mw-track .mt-when{font-size:10.5px;color:var(--mt-muted);margin-top:-4px}
#mw-track .mt-parcel{position:absolute;top:0;left:0;width:28px;height:24px;margin-left:-14px;color:var(--mt-accent);will-change:transform}
#mw-track .mt-parcel svg{width:28px;height:24px;display:block;animation:mtBob 2.4s ease-in-out infinite}
@keyframes mtBob{50%{transform:translateY(-3px)}}

/* latest + timeline */
#mw-track .mt-latest{display:flex;gap:12px;align-items:flex-start;background:var(--mt-tint);border-radius:14px;padding:14px;margin-top:18px}
#mw-track .mt-latest .ic{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--mt-accent);color:var(--mt-accent-fg)}
#mw-track .mt-latest .ic svg{width:18px;height:18px}
#mw-track .mt-latest b{display:block;font-size:15px;line-height:1.35}
#mw-track .mt-latest span{display:block;font-size:13px;color:var(--mt-muted);margin-top:3px}
#mw-track .mt-sec{font-family:var(--mt-font)!important;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--mt-muted);margin:0 0 12px}
#mw-track .mt-tl{list-style:none;margin:0;padding:0}
#mw-track .mt-tl li{position:relative;padding:0 0 18px 26px}
#mw-track .mt-tl li::before{content:"";position:absolute;left:5px;top:6px;width:10px;height:10px;border-radius:50%;background:var(--mt-line)}
#mw-track .mt-tl li::after{content:"";position:absolute;left:9.5px;top:20px;bottom:0;width:1.5px;background:var(--mt-line)}
#mw-track .mt-tl li:last-child{padding-bottom:0}
#mw-track .mt-tl li:last-child::after{display:none}
#mw-track .mt-tl li:first-child::before{background:var(--mt-accent);box-shadow:0 0 0 4px var(--mt-tint)}
#mw-track .mt-tl .t{font-size:15px;line-height:1.35}
#mw-track .mt-tl .m{font-size:13px;color:var(--mt-muted);margin-top:3px}
#mw-track .mt-more{margin-top:6px}
#mw-track .mt-note{font-size:14px;line-height:1.5;color:var(--mt-muted);margin:0}
#mw-track .mt-note a{color:var(--mt-fg);font-weight:600}

/* items */
#mw-track .mt-items{display:grid;gap:12px}
#mw-track .mt-item{display:flex;gap:12px;align-items:center}
#mw-track .mt-item img,#mw-track .mt-item .ph{flex:none;width:64px;height:64px;border-radius:12px;object-fit:cover;background:var(--mt-soft)}
#mw-track .mt-item b{display:block;font-size:14px;line-height:1.35;font-weight:600}
#mw-track .mt-item span{display:block;font-size:13px;color:var(--mt-muted);margin-top:2px}
#mw-track .mt-help{text-align:center;font-size:14px;color:var(--mt-muted);margin:22px 0 0}
#mw-track .mt-help a{color:var(--mt-fg);font-weight:600}

/* skeleton */
#mw-track .mt-sk{position:relative;overflow:hidden;background:var(--mt-soft);border-radius:10px}
#mw-track .mt-sk::after{content:"";position:absolute;inset:0;transform:translateX(-100%);
  background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--mt-bg) 70%,transparent),transparent);animation:mtShim 1.2s infinite}
@keyframes mtShim{100%{transform:translateX(100%)}}

/* phone: 6 labels do not fit side by side, so alternate them on two rows */@media (max-width:560px){#mw-track .mt-steps li:nth-child(even) .mt-lbl{margin-top:30px}#mw-track .mt-lbl{font-size:11px}}
#mw-track .mt-confetti{position:fixed;inset:0;pointer-events:none;z-index:2147483000}
#mw-track .mt-in{animation:mtIn .5s cubic-bezier(.2,.8,.2,1) both}
@keyframes mtIn{from{opacity:0;transform:translateY(12px)}}@media (prefers-reduced-motion:reduce){
  #mw-track .mt *,#mw-track .mt *::before,#mw-track .mt *::after{animation:none!important;transition:none!important}
}
/* actions under the tracker: copy, share, refresh + a live "Updated X ago" */
#mw-track .mt-acts{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:16px}
#mw-track .mt-act{display:inline-flex;align-items:center;gap:6px;border:1.5px solid var(--mt-line);background:var(--mt-bg);color:var(--mt-fg);
  border-radius:999px;padding:8px 12px;font:600 13px/1 var(--mt-font);cursor:pointer;transition:transform .12s,border-color .2s;margin:0}
#mw-track .mt-act:hover{border-color:var(--mt-accent)}
#mw-track .mt-act:active{transform:scale(.95)}
#mw-track .mt-act:disabled{opacity:.75;cursor:default}
#mw-track .mt-act svg{width:16px;height:16px;flex:none}
#mw-track .mt-refresh{padding:8px}
#mw-track .mt-refresh.spin svg{animation:mtSpin .9s cubic-bezier(.4,1.6,.5,1) infinite}
#mw-track .mt-upd{font-size:12px;color:var(--mt-muted);margin-left:auto;white-space:nowrap}
@keyframes mtSpin{to{transform:rotate(360deg)}}
