/* Trackon Tracker v1.0.6 — compact hero form, mobile-first */
.trk-tracker { --trk-orange:#f37021; --trk-orange-dark:#d35f1a; --trk-ink:#1f2937; --trk-muted:#6b7280; --trk-line:#e5e7eb; --trk-bg:#f8fafc; --trk-green:#15803d; --trk-green-bg:#dcfce7; --trk-amber:#b45309; --trk-amber-bg:#fef3c7; --trk-blue:#1d4ed8; --trk-blue-bg:#dbeafe; }
.trk-tracker, .trk-tracker * { box-sizing:border-box; }
/* Compact form matching the site hero design */
.trk-form-compact { background:#fff; padding:7px; border-radius:15px; display:flex; align-items:center; gap:7px; max-width:610px; box-shadow:0 16px 35px rgba(0,19,45,.43); }
.trk-form-compact label { flex:1; min-width:0; display:flex; align-items:center; gap:10px; color:#28609a; padding:0 10px; margin:0; }
.trk-compact-icon { font-size:20px; color:#28609a; flex-shrink:0; }
.trk-form-compact input { border:0; outline:0; width:100%; min-width:0; padding:13px 2px; color:#15335c; font-size:14px; background:transparent; }
.trk-form-compact input::placeholder { color:#7d93a8; }
.trk-form-compact button { background:var(--trk-orange); border:0; border-radius:10px; color:#fff; padding:15px 24px; font-weight:800; font-size:15px; white-space:nowrap; cursor:pointer; }
.trk-form-compact button:hover { background:var(--trk-orange-dark); }
@media (max-width:560px) {
  .trk-form-compact { flex-direction:column; align-items:stretch; }
  .trk-form-compact label { width:100%; }
  .trk-form-compact button { width:100%; }
}
/* Legacy card styles kept for results */
.trk-card { background:#fff; border:1px solid var(--trk-line); border-radius:14px; padding:20px; max-width:720px; margin:0 auto; box-shadow:0 2px 10px rgba(15,23,42,.06); }
.trk-head { display:flex; gap:14px; align-items:flex-start; margin-bottom:16px; }
.trk-head-icon { flex:0 0 44px; width:44px; height:44px; border-radius:12px; background:var(--trk-orange); color:#fff; font-size:24px; display:flex; align-items:center; justify-content:center; }
.trk-head h2 { margin:0 0 4px; font-size:1.25rem; line-height:1.3; color:var(--trk-ink); }
.trk-head p { margin:0; font-size:.9rem; color:var(--trk-muted); line-height:1.5; }
.trk-form label { display:block; font-size:.8rem; font-weight:600; color:var(--trk-ink); margin-bottom:6px; }
.trk-input-row { display:flex; gap:8px; }
.trk-input-row input { flex:1 1 auto; min-width:0; padding:12px 14px; font-size:1rem; border:2px solid var(--trk-line); border-radius:10px; color:var(--trk-ink); }
.trk-input-row input:focus { outline:none; border-color:var(--trk-orange); }
.trk-input-row button { flex:0 0 auto; padding:12px 22px; font-size:1rem; font-weight:700; color:#fff; background:var(--trk-orange); border:0; border-radius:10px; cursor:pointer; }
.trk-input-row button:hover { background:var(--trk-orange-dark); }
.trk-hint { font-size:.78rem; color:var(--trk-muted); margin:8px 0 0; }
.trk-alert { margin-top:14px; padding:12px 14px; border-radius:10px; background:#fef2f2; border:1px solid #fecaca; color:#991b1b; font-size:.9rem; }
.trk-alert strong { display:block; margin-bottom:2px; }
.trk-result-shell { margin-top:18px; }
.trk-summary { display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap; padding:12px 14px; background:var(--trk-bg); border:1px solid var(--trk-line); border-radius:10px; }
.trk-awb span { display:block; font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; color:var(--trk-muted); }
.trk-awb strong { font-size:1.15rem; letter-spacing:.04em; color:var(--trk-ink); }
.trk-status { font-size:.8rem; font-weight:700; padding:6px 12px; border-radius:999px; white-space:nowrap; }
.trk-delivered { background:var(--trk-green-bg); color:var(--trk-green); }
.trk-transit { background:var(--trk-blue-bg); color:var(--trk-blue); }
.trk-exception { background:var(--trk-amber-bg); color:var(--trk-amber); }
.trk-due { margin-top:10px; font-size:.85rem; color:var(--trk-muted); }
.trk-due strong { color:var(--trk-ink); }
.trk-latest { margin-top:10px; padding:12px 14px; border-left:4px solid var(--trk-orange); background:#fff7ed; border-radius:0 10px 10px 0; }
.trk-latest > span:first-child { display:block; font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; color:var(--trk-muted); margin-bottom:2px; }
.trk-latest strong { display:block; color:var(--trk-ink); font-size:.95rem; }
.trk-latest-meta { font-size:.8rem; color:var(--trk-muted); }
.trk-timeline { list-style:none; margin:16px 0 0; padding:0; }
.trk-event { position:relative; display:flex; gap:12px; padding:0 0 18px 4px; }
.trk-event:last-child { padding-bottom:4px; }
.trk-dot { flex:0 0 12px; width:12px; height:12px; margin-top:4px; border-radius:50%; background:#cbd5e1; border:2px solid #fff; box-shadow:0 0 0 2px #cbd5e1; position:relative; z-index:1; }
.trk-event:not(:last-child)::before { content:""; position:absolute; left:9px; top:20px; bottom:0; width:2px; background:var(--trk-line); }
.trk-event.trk-current .trk-dot { background:var(--trk-orange); box-shadow:0 0 0 2px var(--trk-orange); }
.trk-event-body strong { display:block; font-size:.9rem; color:var(--trk-ink); line-height:1.4; }
.trk-event-meta { font-size:.78rem; color:var(--trk-muted); }
.trk-note { font-size:.78rem; color:var(--trk-muted); margin:12px 0 0; }
.trk-noinfo { display:flex; gap:12px; align-items:flex-start; margin-top:14px; padding:14px; border-radius:10px; background:#fffbeb; border:1px solid #fde68a; }
.trk-noinfo-icon { flex:0 0 34px; width:34px; height:34px; border-radius:50%; background:var(--trk-amber); color:#fff; font-weight:700; display:flex; align-items:center; justify-content:center; }
.trk-noinfo strong { display:block; color:var(--trk-ink); margin-bottom:2px; }
.trk-noinfo span { font-size:.88rem; color:var(--trk-muted); line-height:1.5; }
.trk-disclaimer { margin-top:16px; padding-top:12px; border-top:1px solid var(--trk-line); font-size:.72rem; color:var(--trk-muted); line-height:1.5; }
@media (max-width:480px) {
  .trk-card { padding:16px; border-radius:12px; }
  .trk-head h2 { font-size:1.1rem; }
  .trk-input-row { flex-direction:column; }
  .trk-input-row button { width:100%; }
  .trk-awb strong { font-size:1rem; }
}
