.tr-returns {
  display: grid;
  gap: var(--tr-space-8, 32px);
}

.tr-returns h1,
.tr-returns h2,
.tr-returns h3,
.tr-returns p {
  margin-block-start: 0;
}

.tr-returns__intro {
  max-inline-size: 760px;
  color: var(--tr-text-2, #3f4652);
}

.tr-returns__policy {
  display: grid;
  gap: 6px;
  padding: 18px 20px;
  border: 1px solid var(--tr-brand-primary-border, #a9bce2);
  border-inline-start: 4px solid var(--tr-brand-primary, #234999);
  border-radius: var(--tr-radius-md, 10px);
  background: var(--tr-brand-primary-subtle, #edf3ff);
  color: var(--tr-text-2, #3f4652);
}

.tr-returns__policy strong {
  color: var(--tr-ink, #111418);
}

.tr-returns__requests,
.tr-returns__eligible {
  display: grid;
  gap: var(--tr-space-5, 20px);
}

.tr-returns__request-grid,
.tr-returns__orders {
  display: grid;
  gap: var(--tr-space-4, 16px);
}

.tr-return-request,
.tr-return-order {
  padding: var(--tr-space-6, 24px);
  border: 1px solid var(--tr-border, #d8dde5);
  border-radius: var(--tr-radius-lg, 14px);
  background: var(--tr-surface, #fff);
  box-shadow: var(--tr-shadow-sm, 0 4px 14px rgba(17, 20, 24, 0.06));
}

.tr-return-request {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px 20px;
}

.tr-return-request h3,
.tr-return-order h3 {
  margin: 0;
  font-size: clamp(1.15rem, 2vw, 1.4rem);
}

.tr-return-request ul {
  grid-column: 1 / -1;
  margin: 0;
  padding-inline-start: 20px;
}

.tr-return-request small {
  color: var(--tr-muted, #6b7480);
}

.tr-return-request__status,
.tr-return-window {
  display: inline-flex;
  align-items: center;
  align-self: start;
  min-block-size: 30px;
  padding: 5px 10px;
  border: 1px solid var(--tr-brand-primary-border, #a9bce2);
  border-radius: 999px;
  background: var(--tr-brand-primary-subtle, #edf3ff);
  color: var(--tr-brand-primary, #234999);
  font-size: 0.78rem;
  font-weight: 800;
}

.tr-return-request__status[data-status="declined"],
.tr-return-request__status[data-status="cancelled"] {
  border-color: var(--tr-error-border, #e8afb2);
  background: var(--tr-error-bg, #fff1f1);
  color: var(--tr-error, #a5222a);
}

.tr-return-order__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.tr-return-order__dates {
  margin-block: 10px 22px;
  color: var(--tr-muted, #6b7480);
  font-size: 0.9rem;
}

.tr-return-items {
  display: grid;
  gap: 10px;
}

.tr-return-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 110px;
  align-items: center;
  gap: 16px;
  padding: 12px;
  border: 1px solid var(--tr-border, #d8dde5);
  border-radius: var(--tr-radius-md, 10px);
  background: var(--tr-surface-2, #f6f7f9);
}

.tr-return-item__choice {
  display: grid;
  grid-template-columns: 22px 64px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  margin: 0;
  cursor: pointer;
}

.tr-return-item__choice input,
.tr-return-order__ack input {
  inline-size: 20px;
  block-size: 20px;
  accent-color: var(--tr-brand-primary, #234999);
}

.tr-return-item__image {
  inline-size: 64px;
  block-size: 64px;
  overflow: hidden;
  border-radius: 8px;
  background: #fff;
}

.tr-return-item__image img {
  inline-size: 100%;
  block-size: 100%;
  object-fit: contain;
}

.tr-return-item__choice strong,
.tr-return-item__choice small {
  display: block;
}

.tr-return-item__choice small {
  margin-block-start: 4px;
  color: var(--tr-muted, #6b7480);
}

.tr-return-item__quantity,
.tr-return-order__fields label:not(.tr-return-order__ack) {
  display: grid;
  gap: 7px;
  margin: 0;
  color: var(--tr-text-2, #3f4652);
  font-size: 0.82rem;
  font-weight: 750;
}

.tr-return-item__quantity input,
.tr-return-order__fields select,
.tr-return-order__fields textarea {
  inline-size: 100%;
  min-block-size: 44px;
  border: 1px solid var(--tr-border-strong, #b9c0ca);
  border-radius: 8px;
  background: #fff;
  color: var(--tr-ink, #111418);
}

.tr-return-order__fields {
  display: grid;
  gap: 16px;
  margin-block: 22px;
}

.tr-return-order__ack {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  margin: 0;
  font-weight: 700;
}

.tr-return-order .tr-button {
  min-block-size: 48px;
  padding: 12px 20px;
  border: 1px solid var(--tr-brand-primary, #234999);
  border-radius: 8px;
  background: var(--tr-brand-primary, #234999);
  color: #fff;
  font-weight: 800;
}

.tr-return-order .tr-button:hover {
  background: var(--tr-brand-primary-hover, #1c3b7c);
}

.tr-return-order :focus-visible {
  outline: 3px solid rgba(35, 73, 153, 0.24);
  outline-offset: 3px;
}

@media (max-width: 600px) {
  .tr-return-request,
  .tr-return-order {
    padding: 18px;
  }

  .tr-return-request,
  .tr-return-item {
    grid-template-columns: 1fr;
  }

  .tr-return-request__status,
  .tr-return-window {
    justify-self: start;
  }

  .tr-return-order__header {
    display: grid;
  }

  .tr-return-item__quantity {
    grid-template-columns: 1fr 90px;
    align-items: center;
  }

  .tr-return-order .tr-button {
    inline-size: 100%;
  }
}
