
.opd-tc-track-box{max-width:980px;margin:24px auto;padding:20px;border:1px solid rgba(0,0,0,.08);border-radius:20px;background:#fff;box-shadow:0 8px 26px rgba(0,0,0,.04)}
.opd-tc-track-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:18px}
.opd-tc-track-head h2{margin:0 0 6px;font-size:28px;line-height:1.1}
.opd-tc-track-sub{display:flex;flex-wrap:wrap;gap:12px;color:#666;font-size:13px}
.opd-tc-auto-refresh{color:#0a7a35;font-weight:600}
.opd-tc-status-pill{padding:8px 14px;border-radius:999px;font-size:13px;font-weight:700;background:#f6f7f7;border:1px solid #dcdcde;white-space:nowrap}
.opd-tc-step-delivered{background:#edfaef;border-color:#b6e3c0}
.opd-tc-step-out_for_delivery{background:#fff6e5;border-color:#f2d49b}
.opd-tc-step-in_transit{background:#eef4ff;border-color:#b8cef7}
.opd-tc-top-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:18px}
.opd-tc-info-card{border:1px solid rgba(0,0,0,.08);border-radius:18px;padding:16px;background:#fafafa}
.opd-tc-info-label{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:#666;margin-bottom:8px}
.opd-tc-carrier-line{display:flex;align-items:center;gap:10px;font-size:18px}
.opd-tc-carrier-badge{width:14px;height:14px;border-radius:999px;background:#111;display:inline-block}
.opd-tc-carrier-royal-mail{background:#d52b1e}
.opd-tc-carrier-evri{background:#6c2bd9}
.opd-tc-carrier-dpd{background:#c10f2f}
.opd-tc-carrier-ups{background:#5c4325}
.opd-tc-carrier-dhl{background:#f2c300}
.opd-tc-tracking-no{margin-top:8px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;word-break:break-all;color:#444}
.opd-tc-eta{font-size:22px;font-weight:700}
.opd-tc-proof-link{font-weight:600;text-decoration:none}
.opd-tc-proof-empty{color:#666}
.opd-tc-progress-wrap{padding:16px 6px 18px}
.opd-tc-progress-bar{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;position:relative}
.opd-tc-progress-bar:before{content:"";position:absolute;left:10%;right:10%;top:16px;height:3px;background:#e3e6ea;z-index:0}
.opd-tc-progress-step{position:relative;z-index:1;text-align:center;padding:0 6px}
.opd-tc-progress-dot{width:18px;height:18px;border-radius:999px;background:#c7ccd1;border:3px solid #fff;box-shadow:0 0 0 2px #c7ccd1;margin:8px auto}
.opd-tc-progress-label{font-size:12px;color:#555;margin-top:8px;line-height:1.2}
.opd-tc-done .opd-tc-progress-dot{background:#0a7a35;box-shadow:0 0 0 2px #0a7a35}
.opd-tc-current .opd-tc-progress-dot{background:#d49f0a;box-shadow:0 0 0 2px #d49f0a}
.opd-tc-timeline-card{border:1px solid rgba(0,0,0,.08);border-radius:18px;padding:18px;background:#fff}
.opd-tc-timeline-card h3{margin:0 0 12px;font-size:18px}
.opd-tc-track-timeline{display:flex;flex-direction:column;gap:12px}
.opd-tc-ev{display:grid;grid-template-columns:42px 1fr;gap:12px;align-items:start;padding:10px 0;border-top:1px solid rgba(0,0,0,.06)}
.opd-tc-ev:first-child{border-top:0;padding-top:0}
.opd-tc-ev-icon{width:42px;height:42px;border-radius:14px;background:#f6f7f7;display:flex;align-items:center;justify-content:center;font-size:20px}
.opd-tc-ev-title{font-weight:700;font-size:15px}
.opd-tc-ev-meta{color:#666;font-size:12px;margin-top:4px}
.opd-tc-track-empty{padding:12px 0;color:#666}
@media (max-width: 820px){
  .opd-tc-track-box{padding:16px}
  .opd-tc-track-head{flex-direction:column}
  .opd-tc-top-grid{grid-template-columns:1fr}
  .opd-tc-progress-bar{grid-template-columns:1fr 1fr}
  .opd-tc-progress-bar:before{display:none}
  .opd-tc-progress-step{padding:6px 0}
}
