/* AMITTA order tracking: the page component. Loaded by the theme page (snippet amitta-content-track) and by
   public/index.html. Everything is scoped under .trk; --font comes from the host page. */
.trk{--bg:#fff;--ink:#141414;--body:#3A4143;--mut:#8A9193;--hair:#E4E7E6;
  --tealpale:#E3F5F2;--tealight:#94D0CA;--teal:#409895;--tealdeep:#2C6C6E;--night:#143D42;
  --sand:#F0E9DC;--sanddeep:#D6C9B4;--alert:#A9503C;--radius:2px;font-family:var(--font);color:var(--ink)}
.trk .eyebrow{display:block;font-size:11px;letter-spacing:.2em;color:var(--body);margin-block-end:10px}
.trk h1{font-weight:200;font-size:40px;line-height:1.1;margin:0 0 12px;text-wrap:balance}
.trk .lead{color:var(--body);margin:0 0 28px;max-inline-size:34em}
.trk .track-form{display:grid;grid-template-columns:1fr 1fr auto;gap:12px;align-items:end;border:1px solid var(--hair);padding:22px;border-radius:var(--radius)}
.trk .field span{display:block;font-size:12px;letter-spacing:.04em;color:var(--body);margin-block-end:6px}
.trk .field input{inline-size:100%;font:300 16px var(--font);color:var(--ink);border:1px solid var(--hair);border-radius:var(--radius);padding:12px 14px;background:#fff;outline:none;transition:border-color .15s}
.trk .field input:hover{border-color:var(--tealdeep)}
.trk .field input:focus,.trk .field input:focus-visible{border-color:var(--night);outline:none;box-shadow:none}
.trk .field input[aria-invalid=true]{border-color:var(--alert)}
.trk .btn{min-block-size:50px;font:400 15px var(--font);line-height:1.4;background:var(--night);color:#fff;border:1px solid var(--night);border-radius:var(--radius);padding:12px 26px;cursor:pointer;transition:background .15s,border-color .15s;white-space:nowrap}
.trk .btn:hover:not(:disabled){background:var(--tealdeep);border-color:var(--tealdeep)}
.trk .btn:disabled{opacity:.6;cursor:progress}
.trk .btn:focus-visible,.trk .link:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
.trk .fine{grid-column:1/-1;margin:0;font-size:13px;color:var(--body)}
.trk .link{background:none;border:0;padding:0;font:inherit;color:var(--tealdeep);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.trk .err{grid-column:1/-1;margin:0;color:var(--alert);font-size:14px}
.trk .hidden{display:none!important}
.trk .result{margin-block-start:28px}
.trk .card{border:1px solid var(--hair);border-radius:var(--radius);padding:26px;margin-block-end:16px;animation:in .35s ease both}
@keyframes in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.trk .card-head h2{font-weight:200;font-size:30px;line-height:1.15;margin:2px 0 6px}
.trk .card-head p{margin:0;color:var(--body)}
.trk .sub{font-size:12px;letter-spacing:.06em;color:var(--body)}
.trk .journey{list-style:none;margin:28px 0 8px;padding:0;display:grid;grid-template-columns:repeat(5,1fr);position:relative}
.trk .journey::before{content:'';position:absolute;inset-inline:calc(100%/10);inset-block-start:7px;border-block-start:1.5px solid var(--hair)}
.trk .journey .fill{position:absolute;inset-inline-start:calc(100%/10);inset-block-start:7px;block-size:1.5px;background:var(--night);transition:inline-size .8s cubic-bezier(.2,.7,.2,1)}
.trk .journey li{position:relative;text-align:center;font-size:12px;color:var(--ink);display:flex;flex-direction:column;align-items:center;gap:8px}
.trk .journey i{inline-size:15px;block-size:15px;border-radius:999px;border:1.5px solid var(--hair);background:#fff;position:relative;z-index:1}
.trk .journey li.done{color:var(--night)}
.trk .journey li.done i{background:var(--night);border-color:var(--night)}
.trk .journey li.now{color:var(--night);font-weight:400}
.trk .journey li.now i{border-color:var(--night);background:#fff;box-shadow:0 0 0 5px var(--tealpale)}
.trk .journey li.now i::after{content:'';position:absolute;inset:3px;border-radius:999px;background:var(--night)}
@media (prefers-reduced-motion:no-preference){.trk .journey li.now i{animation:pulse 2.4s ease-in-out infinite}}
@keyframes pulse{50%{box-shadow:0 0 0 9px rgba(227,245,242,.35)}}
.trk .events{list-style:none;margin:22px 0 0;padding:0;border-block-start:1px solid var(--hair)}
.trk .events li{display:grid;grid-template-columns:112px 1fr;gap:16px;padding:13px 0;border-block-end:1px solid var(--hair)}
.trk .events time{font-size:13px;color:var(--body);font-variant-numeric:tabular-nums;line-height:1.5}
.trk .events time span{display:block;color:var(--mut)}
.trk .help a,.trk .panel a,.trk .signin a{color:var(--tealdeep);text-decoration:underline;text-underline-offset:3px}
.trk .events li:first-child b{font-weight:400;color:var(--ink)}
.trk .events li:last-child{border-block-end:0;padding-block-end:0}
.trk .events b{font-weight:300;color:var(--body)}
.trk .more{margin-block-start:12px}
.trk .panel{border-radius:var(--radius);padding:16px 18px;margin-block-start:16px;display:flex;flex-direction:column;gap:2px}
.trk .panel.sand{background:var(--sand)}
.trk .panel.teal{background:var(--tealpale)}
.trk .panel.warn{background:#F6E6E1}
.trk .panel b{font-weight:400}
.trk .code{font:500 22px var(--font);letter-spacing:.12em;color:var(--night);direction:ltr;unicode-bidi:isolate}
.trk .loading{display:flex;align-items:center;justify-content:center;gap:12px;color:var(--body);padding:22px 0}
.trk .dots{display:inline-flex;gap:5px}
.trk .dots span{inline-size:6px;block-size:6px;border-radius:999px;background:var(--tealight);animation:dot 1s infinite ease-in-out}
.trk .dots span:nth-child(2){animation-delay:.15s}
.trk .dots span:nth-child(3){animation-delay:.3s}
@keyframes dot{50%{transform:translateY(-4px);background:var(--teal)}}
.trk .hello{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin:0 0 10px;font-size:13px;letter-spacing:.06em;color:var(--body)}
.trk .hello h2{font:inherit;margin:0}
.trk .dates{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--hair);border:1px solid var(--hair);border-radius:var(--radius);margin:0 0 16px}
.trk .dates div{background:#fff;padding:12px 14px}
.trk .dates dt{font-size:11px;letter-spacing:.06em;color:var(--body);margin-block-end:2px}
.trk .dates dd{margin:0;font-size:14px;color:var(--ink)}
.trk .notice{font-size:14px;color:var(--body);background:var(--tealpale);border-radius:var(--radius);padding:14px 18px;margin-block-start:16px}
.trk .help{margin-block-start:40px;border-block-start:1px solid var(--hair);padding-block-start:24px}
.trk .help h3{font-weight:300;font-size:22px;margin:0 0 6px}
.trk .help p{margin:0;color:var(--body)}
@media (max-width:640px){.trk h1{font-size:34px}.trk .track-form{grid-template-columns:1fr;padding:18px}.trk .btn{inline-size:100%}.trk .card{padding:20px}.trk .card-head h2{font-size:26px}.trk .journey li span{font-size:10.5px;line-height:1.3}.trk .events li{grid-template-columns:100px 1fr;gap:12px}}
.trk .mine{border:1px solid var(--hair);border-radius:var(--radius);padding:18px 22px;margin-block-end:16px}
.trk .mine h2{font-weight:300;font-size:22px;margin:0 0 4px}
.trk .mine p{margin:0 0 12px;color:var(--body);font-size:14px}
.trk .mine ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.trk .mine button{font:300 14px var(--font);color:var(--ink);background:#fff;border:1px solid var(--hair);border-radius:var(--radius);padding:9px 14px;cursor:pointer}
.trk .mine button[aria-pressed=true]{border-color:var(--night);color:var(--night);font-weight:400}
.trk .mine button:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
.trk .signin{margin:0 0 16px;font-size:14px;color:var(--body)}