/* ==========================================================
   ALEX SELLER — Order tracking pages
   ========================================================== */

.order-track-card{ padding:32px; }
.order-track-header{ display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:28px; flex-wrap:wrap; gap:14px; }
.order-track-code{ font-family:monospace; font-size:20px; font-weight:700; letter-spacing:0.03em; }

/* ---------------- Timeline ---------------- */
.order-timeline{ display:flex; justify-content:space-between; margin:30px 0 34px; position:relative; }
.order-timeline::before{
  content:""; position:absolute; top:19px; left:6%; right:6%; height:2px; background: var(--border-glass); z-index:0;
}
.order-timeline-step{ display:flex; flex-direction:column; align-items:center; gap:8px; position:relative; z-index:1; flex:1; }
.order-timeline-dot{
  width:40px; height:40px; border-radius:50%; background: var(--bg-glass-strong); border:1.5px solid var(--border-glass);
  display:flex; align-items:center; justify-content:center; color: var(--text-muted); transition: var(--transition);
}
.order-timeline-dot i{ width:18px; height:18px; }
.order-timeline-step span{ font-size:11.5px; color: var(--text-muted); text-align:center; }
.order-timeline-step.done .order-timeline-dot{ background: var(--grad-primary); border-color:transparent; color:#fff; }
.order-timeline-step.done span{ color: var(--text-primary); font-weight:600; }

@media (max-width: 560px){ .order-timeline-step span{ display:none; } }

/* ---------------- Details ---------------- */
.order-track-details, .order-track-items{ margin-top:10px; }
.order-detail-row{ display:flex; justify-content:space-between; padding:10px 0; font-size:14px; color: var(--text-secondary); border-bottom:1px solid var(--border-glass); }
.order-detail-row span:last-child{ color: var(--text-primary); font-weight:600; text-align:right; }
.order-track-subhead{ margin-top:24px; margin-bottom:10px; font-size:15px; }

.order-admin-note{
  display:flex; gap:10px; margin-top:20px; padding:14px 16px;
  background: var(--bg-glass); border:1px solid var(--border-glass); border-radius: var(--radius-sm);
  font-size:13.5px; color: var(--text-secondary);
}
.order-admin-note i{ width:18px; height:18px; color: var(--c-accent-2); flex-shrink:0; }

.order-delivery-box{ padding:20px; margin-top:12px; }
.order-pending-note{
  display:flex; align-items:center; gap:10px; margin-top:18px; padding:14px 16px;
  background: var(--bg-glass); border-radius: var(--radius-sm); font-size:13.5px; color: var(--text-muted);
}
.order-pending-note i{ width:16px; height:16px; }

.order-track-actions{ margin-top:26px; text-align:center; }

/* ---------------- Lookup Form ---------------- */
.track-form-card{ padding:40px 32px; }
.track-form{ margin-top:24px; }
