.sb-order-tracking,
.sb-account-tracking {
  --sb-primary: #1f6f78;
  --sb-primary-soft: #e8f3f4;
  --sb-border: #e4e4e4;
  --sb-muted: #6f6f6f;
  direction: rtl;
  text-align: right;
}

.sb-tracking-form,
.sb-tracking-result {
  border: 1px solid var(--sb-border);
  border-radius: 14px;
  background: #fff;
  padding: clamp(18px, 4vw, 30px);
  margin-bottom: 24px;
}

.sb-tracking-form h2 {
  margin: 0 0 10px;
  font-size: clamp(1.35rem, 3vw, 1.8rem);
}

.sb-tracking-form > p {
  color: var(--sb-muted);
  margin: 0;
}

.sb-tracking-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin: 18px 0;
}

.sb-tracking-fields label {
  display: grid;
  gap: 7px;
  font-weight: 600;
}

.sb-tracking-fields input {
  width: 100%;
  min-height: 46px;
  direction: rtl;
  text-align: right;
}

.sb-tracking-form .button {
  min-height: 46px;
  min-width: 160px;
}

.sb-tracking-error {
  margin: 18px 0 !important;
}

.sb-tracking-result h3,
.sb-public-shipments h4 {
  margin-top: 0;
}

.sb-tracking-timeline {
  list-style: none;
  margin: 24px 0;
  padding: 0;
}

.sb-tracking-timeline li {
  position: relative;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 14px;
  min-height: 92px;
  margin: 0;
  padding: 0 0 24px;
}

.sb-tracking-timeline li:not(:last-child)::before {
  content: "";
  position: absolute;
  right: 12px;
  top: 25px;
  bottom: -1px;
  width: 3px;
  background: var(--sb-border);
}

.sb-tracking-timeline li.is-complete:not(:last-child)::before {
  background: var(--sb-primary);
}

.sb-step-marker {
  position: relative;
  z-index: 1;
  width: 26px;
  height: 26px;
  border: 4px solid #fff;
  border-radius: 50%;
  background: #c8c8c8;
  box-shadow: 0 0 0 2px var(--sb-border);
}

.is-complete .sb-step-marker {
  background: var(--sb-primary);
  box-shadow: 0 0 0 2px var(--sb-primary);
}

.sb-tracking-timeline strong {
  display: block;
  font-size: 1.05em;
  margin-bottom: 4px;
}

.sb-tracking-timeline p,
.sb-tracking-timeline time,
.sb-post-note {
  color: var(--sb-muted);
}

.sb-tracking-timeline p {
  margin: 0 0 4px;
}

.sb-tracking-timeline time {
  font-size: .9em;
}

.sb-public-shipments {
  border-top: 1px solid var(--sb-border);
  padding-top: 20px;
}

.sb-public-shipment {
  display: grid;
  grid-template-columns: minmax(120px, 1fr) minmax(130px, 1fr) auto;
  align-items: center;
  gap: 12px;
  border-radius: 10px;
  background: var(--sb-primary-soft);
  padding: 14px;
  margin: 10px 0;
}

.sb-public-shipment strong {
  direction: ltr;
  text-align: right;
}

.sb-terminal-status {
  display: grid;
  gap: 7px;
  border-right: 4px solid #bd2d2d;
  background: #fff3f3;
  padding: 16px;
}

.sb-admin-shipments {
  margin: 0 18px 12px 0;
}

.sb-admin-shipments li {
  margin-bottom: 12px;
}

.sb-admin-complete {
  color: #19733b;
}

@media (max-width: 600px) {
  .sb-tracking-fields,
  .sb-public-shipment {
    grid-template-columns: 1fr;
  }

  .sb-public-shipment .button {
    text-align: center;
  }
}