.client-purchases-list {
  display: grid;
  gap: 14px;
}

.client-purchase-card {
  display: grid;
  gap: 14px;
  border: 1px solid rgba(0,72,44,.12);
  border-radius: 22px;
  padding: 16px;
  background: rgba(255,255,255,.74);
}

body[data-theme="dark"] .client-purchase-card {
  background: rgba(255,255,255,.08);
  border-color: rgba(203,234,215,.2);
}

.client-purchase-head,
.client-purchase-foot {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}

.client-purchase-title {
  display: grid;
  gap: 4px;
}

.client-purchase-title strong {
  color: var(--shell-title, #073f2d);
  font-size: 18px;
}

body[data-theme="dark"] .client-purchase-title strong,
body[data-theme="dark"] .client-purchase-total,
body[data-theme="dark"] .client-purchase-item strong,
body[data-theme="dark"] .purchase-summary-item strong,
body[data-theme="dark"] .purchase-summary-totals strong,
body[data-theme="dark"] .purchase-summary-grid strong,
body[data-theme="dark"] .client-purchase-summary-dialog h2,
body[data-theme="dark"] .purchase-summary-items h3 {
  color: #ecfff4;
}

.client-purchase-title span,
.client-purchase-meta span,
.client-purchase-items span {
  color: var(--shell-muted, #607568);
}

body[data-theme="dark"] .client-purchase-title span,
body[data-theme="dark"] .client-purchase-meta span,
body[data-theme="dark"] .client-purchase-items span,
body[data-theme="dark"] .purchase-summary-grid span,
body[data-theme="dark"] .purchase-summary-item span,
body[data-theme="dark"] .purchase-summary-totals span {
  color: #abc7b7;
}

.client-purchase-status {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 11px;
  border-radius: 999px;
  font-weight: 900;
  font-size: 12px;
  background: rgba(15,143,80,.1);
  color: #0f8f50;
}

body[data-theme="dark"] .client-purchase-status {
  background: rgba(54,214,122,.18);
  color: #7dffad;
}

.client-purchase-status.pending {
  background: rgba(217,119,6,.13);
  color: #9a5a00;
}

.client-purchase-status.failed,
.client-purchase-status.cancelled,
.client-purchase-status.canceled {
  background: rgba(159,29,29,.1);
  color: #9f1d1d;
}

body[data-theme="dark"] .client-purchase-status.pending {
  background: rgba(255,197,87,.16);
  color: #ffd891;
}

body[data-theme="dark"] .client-purchase-status.failed,
body[data-theme="dark"] .client-purchase-status.cancelled,
body[data-theme="dark"] .client-purchase-status.canceled {
  background: rgba(255,154,154,.14);
  color: #ff9a9a;
}

.client-purchase-items {
  display: grid;
  gap: 8px;
}

.client-purchase-item {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  border-radius: 14px;
  padding: 10px 12px;
  background: rgba(15,143,80,.06);
}

body[data-theme="dark"] .client-purchase-item {
  background: rgba(54,214,122,.08);
}

.client-purchase-total {
  font-size: 20px;
  color: var(--shell-title, #073f2d);
}

.client-purchase-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.client-purchase-summary-modal {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.client-purchase-summary-modal.is-open {
  display: flex;
}

.client-purchase-summary-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(3, 25, 17, .42);
  backdrop-filter: blur(8px);
}

.client-purchase-summary-dialog {
  position: relative;
  width: min(720px, 100%);
  max-height: min(86vh, 820px);
  overflow: auto;
  border-radius: 28px;
  padding: 28px;
  background: rgba(255,255,255,.94);
  border: 1px solid rgba(0,72,44,.14);
  box-shadow: 0 28px 80px rgba(0,72,44,.2);
  color: var(--shell-title, #073f2d);
}

body[data-theme="dark"] .client-purchase-summary-dialog {
  background: rgba(16, 29, 23, .96);
  border-color: rgba(203,234,215,.18);
  box-shadow: 0 32px 90px rgba(0,0,0,.45);
}

.client-purchase-summary-close {
  position: absolute;
  top: 18px;
  right: 18px;
  width: 42px;
  height: 42px;
  border-radius: 999px;
  border: 1px solid rgba(0,72,44,.15);
  background: rgba(255,255,255,.78);
  color: var(--shell-title, #073f2d);
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
}

body[data-theme="dark"] .client-purchase-summary-close {
  background: rgba(255,255,255,.08);
  border-color: rgba(203,234,215,.18);
  color: #ecfff4;
}

.client-purchase-summary-dialog h2 {
  margin: 10px 48px 18px 0;
  font-size: clamp(30px, 4vw, 44px);
  line-height: 1;
  letter-spacing: -.04em;
}

.client-purchase-summary-body {
  display: grid;
  gap: 18px;
}

.purchase-summary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.purchase-summary-grid > div,
.purchase-summary-totals,
.purchase-summary-items {
  border: 1px solid rgba(0,72,44,.12);
  border-radius: 18px;
  padding: 14px;
  background: rgba(15,143,80,.04);
}

body[data-theme="dark"] .purchase-summary-grid > div,
body[data-theme="dark"] .purchase-summary-totals,
body[data-theme="dark"] .purchase-summary-items {
  background: rgba(54,214,122,.06);
  border-color: rgba(203,234,215,.14);
}

.purchase-summary-grid span,
.purchase-summary-totals span,
.purchase-summary-item span {
  display: block;
  color: var(--shell-muted, #607568);
  font-size: 13px;
}

.purchase-summary-grid strong {
  display: block;
  margin-top: 4px;
  overflow-wrap: anywhere;
}

.purchase-summary-items h3 {
  margin: 0 0 12px;
  font-size: 18px;
}

.purchase-summary-item,
.purchase-summary-totals div {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 0;
}

.purchase-summary-item + .purchase-summary-item,
.purchase-summary-totals div + div {
  border-top: 1px solid rgba(0,72,44,.1);
}

body[data-theme="dark"] .purchase-summary-item + .purchase-summary-item,
body[data-theme="dark"] .purchase-summary-totals div + div {
  border-top-color: rgba(203,234,215,.12);
}

.purchase-summary-total strong {
  font-size: 24px;
}

@media (max-width: 680px) {
  .purchase-summary-grid {
    grid-template-columns: 1fr;
  }

  .client-purchase-summary-dialog {
    padding: 22px;
  }
}
