.pa-refund-trigger,
.pa-refund-dialog button,
.pa-refund-dialog input,
.pa-refund-dialog textarea {
  font: inherit;
}

.pa-refund-trigger {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  border: var(--pa-border);
  border-radius: var(--pa-radius-sm);
  padding: 0 13px;
  background: var(--pa-metal-panel);
  color: var(--pa-color-text);
  cursor: pointer;
  font-family: var(--pa-font);
  font-size: .84rem;
  font-weight: var(--pa-weight-semibold);
  transition: transform var(--pa-transition), border-color var(--pa-transition), background-color var(--pa-transition);
}

.pa-refund-trigger:hover {
  border-color: var(--pa-color-primary-line);
  background: var(--pa-color-surface-2);
  transform: translateY(-1px);
}

.pa-drawer-actions > .pa-refund-trigger {
  grid-column: 1 / -1;
  width: 100%;
}

.pa-refund-notice {
  margin: 0;
  border: 1px solid color-mix(in srgb, var(--pa-color-success) 30%, transparent);
  border-radius: var(--pa-radius-sm);
  padding: 10px 12px;
  background: color-mix(in srgb, var(--pa-color-success) 9%, var(--pa-color-bg-soft));
  color: var(--pa-color-text-soft);
  font-size: var(--pa-size-label);
}

.pa-drawer-actions:has(.pa-refund-trigger) {
  grid-template-columns: 1fr;
}

.pa-refund-dialog {
  position: relative;
  z-index: 1;
  display: grid;
  width: min(920px, calc(100vw - 32px));
  max-height: calc(100vh - 32px);
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: hidden;
  border: var(--pa-border);
  border-color: var(--pa-color-line-strong);
  border-radius: var(--pa-radius-lg);
  background: var(--pa-color-surface);
  color: var(--pa-color-text);
  box-shadow: 0 24px 90px rgba(0, 0, 0, .48), inset 0 1px 0 rgba(255, 255, 255, .04);
  font-family: var(--pa-font);
}

.pa-refund-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--pa-space-4);
  padding: var(--pa-space-5);
}

.pa-refund-head-copy {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.pa-refund-kicker {
  display: inline-flex;
  align-items: center;
  gap: var(--pa-space-2);
  color: var(--pa-color-primary-hover);
  font-size: var(--pa-size-caption);
  font-weight: var(--pa-weight-medium);
}

.pa-refund-head h2,
.pa-refund-head p,
.pa-refund-section h3,
.pa-refund-summary p,
.pa-refund-summary strong,
.pa-refund-summary small,
.pa-refund-empty,
.pa-refund-error {
  margin: 0;
}

.pa-refund-head h2 {
  color: var(--pa-color-text);
  font-size: var(--pa-size-title);
  font-weight: var(--pa-weight-bold);
  letter-spacing: -.03em;
  line-height: 1.08;
}

.pa-refund-head p {
  overflow-wrap: anywhere;
  color: var(--pa-color-muted);
  font-size: var(--pa-size-label);
}

.pa-refund-close {
  display: inline-flex;
  width: 38px;
  min-height: 38px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  border: var(--pa-border);
  border-radius: var(--pa-radius-sm);
  padding: 0;
  background: var(--pa-metal-panel);
  color: var(--pa-color-text);
  cursor: pointer;
  transition: transform var(--pa-transition), border-color var(--pa-transition), background-color var(--pa-transition);
}

.pa-refund-close:hover {
  border-color: var(--pa-color-line-strong);
  background: var(--pa-color-surface-2);
  transform: translateY(-1px);
}

.pa-refund-body {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr);
  gap: var(--pa-space-3);
  min-height: 0;
  overflow: hidden;
  border-top: var(--pa-border);
  border-bottom: var(--pa-border);
  padding: var(--pa-space-4);
  background: var(--pa-color-bg-soft);
}

.pa-refund-section {
  display: grid;
  align-content: start;
  gap: var(--pa-space-3);
  min-height: 0;
  border: var(--pa-border);
  border-radius: var(--pa-radius-md);
  padding: var(--pa-space-4);
  background: var(--pa-metal-panel-soft);
}

.pa-refund-section:first-child {
  overflow-y: auto;
}

.pa-refund-section h3 {
  color: var(--pa-color-text-soft);
  font-size: var(--pa-size-label);
  font-weight: var(--pa-weight-bold);
}

.pa-refund-purchases {
  display: grid;
  gap: var(--pa-space-2);
}

.pa-refund-purchase {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 11px;
  align-items: start;
  border: var(--pa-border);
  border-radius: var(--pa-radius-sm);
  padding: 12px;
  background: var(--pa-color-bg-soft);
  cursor: pointer;
  transition: border-color var(--pa-transition), background-color var(--pa-transition), box-shadow var(--pa-transition);
}

.pa-refund-purchase:hover {
  border-color: var(--pa-color-line-strong);
}

.pa-refund-purchase:has(input:checked) {
  border-color: var(--pa-color-primary-line);
  background: var(--pa-color-primary-soft);
  box-shadow: inset 3px 0 0 var(--pa-color-primary);
}

.pa-refund-purchase:has(input:disabled) {
  cursor: not-allowed;
  opacity: .48;
}

.pa-refund-purchase input {
  width: 16px;
  height: 16px;
  margin: 2px 0 0;
  accent-color: var(--pa-color-primary);
}

.pa-refund-purchase-copy {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.pa-refund-purchase-copy strong {
  overflow-wrap: anywhere;
  color: var(--pa-color-text);
  font-size: var(--pa-size-label);
  font-weight: var(--pa-weight-semibold);
}

.pa-refund-purchase-copy span,
.pa-refund-purchase-copy small,
.pa-refund-history small {
  overflow-wrap: anywhere;
  color: var(--pa-color-muted);
  font-size: var(--pa-size-caption);
}

.pa-refund-purchase-amount {
  color: var(--pa-color-text);
  font-size: var(--pa-size-label);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.pa-refund-fields {
  display: grid;
  gap: var(--pa-space-3);
}

.pa-refund-field {
  display: grid;
  gap: 6px;
  color: var(--pa-color-muted);
  font-size: var(--pa-size-caption);
  font-weight: var(--pa-weight-medium);
}

.pa-refund-field input,
.pa-refund-field textarea {
  width: 100%;
  min-height: 42px;
  border: var(--pa-border);
  border-radius: var(--pa-radius-sm);
  padding: 0 12px;
  outline: none;
  background: var(--pa-metal-panel);
  color: var(--pa-color-text);
  font-size: .86rem;
  font-weight: var(--pa-weight-regular);
  transition: border-color var(--pa-transition), background-color var(--pa-transition), box-shadow var(--pa-transition);
}

.pa-refund-field input:focus,
.pa-refund-field textarea:focus {
  border-color: var(--pa-color-primary-line);
  box-shadow: var(--pa-focus-ring);
}

.pa-refund-field input:disabled {
  cursor: not-allowed;
  opacity: .56;
}

.pa-refund-field textarea {
  min-height: 78px;
  padding-top: 10px;
  padding-bottom: 10px;
  resize: vertical;
}

.pa-refund-summary {
  position: sticky;
  top: 0;
  display: grid;
  gap: 5px;
  border: var(--pa-border);
  border-color: color-mix(in srgb, var(--pa-color-danger) 32%, transparent);
  border-radius: var(--pa-radius-sm);
  padding: var(--pa-space-3);
  background: color-mix(in srgb, var(--pa-color-danger) 7%, var(--pa-color-bg-soft));
  box-shadow: inset 3px 0 0 color-mix(in srgb, var(--pa-color-danger) 78%, transparent);
}

.pa-refund-summary span {
  color: var(--pa-color-muted);
  font-size: var(--pa-size-caption);
  font-weight: var(--pa-weight-bold);
  text-transform: uppercase;
}

.pa-refund-summary strong {
  color: var(--pa-color-danger);
  font-size: 1.15rem;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
}

.pa-refund-summary p,
.pa-refund-summary small {
  color: var(--pa-color-muted);
  font-size: var(--pa-size-caption);
  font-weight: var(--pa-weight-medium);
}

.pa-refund-history {
  display: grid;
  gap: var(--pa-space-2);
  border-top: var(--pa-border);
  padding-top: var(--pa-space-3);
}

.pa-refund-history article {
  display: grid;
  gap: 3px;
  border: var(--pa-border);
  border-radius: var(--pa-radius-xs);
  padding: 10px 11px;
  background: var(--pa-color-bg-soft);
}

.pa-refund-history strong {
  color: var(--pa-color-text-soft);
  font-size: var(--pa-size-label);
  font-variant-numeric: tabular-nums;
}

.pa-refund-error {
  border: 1px solid color-mix(in srgb, var(--pa-color-danger) 30%, transparent);
  border-radius: var(--pa-radius-sm);
  padding: 9px 10px;
  background: color-mix(in srgb, var(--pa-color-danger) 8%, var(--pa-color-bg-soft));
  color: var(--pa-color-danger);
  font-size: var(--pa-size-caption);
}

.pa-refund-empty {
  border: var(--pa-border);
  border-radius: var(--pa-radius-sm);
  padding: var(--pa-space-4);
  background: var(--pa-color-bg-soft);
  color: var(--pa-color-muted);
  font-size: var(--pa-size-label);
}

.pa-refund-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: var(--pa-space-2);
  padding: var(--pa-space-4) var(--pa-space-5);
}

.pa-refund-actions button {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  border: var(--pa-border);
  border-radius: var(--pa-radius-sm);
  padding: 0 14px;
  background: var(--pa-color-bg-soft);
  color: var(--pa-color-text);
  cursor: pointer;
  font-size: var(--pa-size-label);
  font-weight: var(--pa-weight-bold);
  transition: transform var(--pa-transition), border-color var(--pa-transition), background-color var(--pa-transition), opacity var(--pa-transition);
}

.pa-refund-actions button:hover:not(:disabled) {
  border-color: var(--pa-color-line-strong);
  background: var(--pa-color-surface-2);
  transform: translateY(-1px);
}

.pa-refund-actions button[type="submit"] {
  border-color: color-mix(in srgb, var(--pa-color-danger) 55%, transparent);
  background: var(--pa-color-danger);
  color: #fff;
}

.pa-refund-actions button[type="submit"]:hover:not(:disabled) {
  border-color: var(--pa-color-danger);
  background: color-mix(in srgb, var(--pa-color-danger) 86%, #000);
}

.pa-refund-actions button:disabled {
  cursor: not-allowed;
  opacity: .42;
}

@media (max-width: 720px) {
  .pa-refund-dialog {
    width: calc(100vw - 16px);
    max-height: calc(100vh - 16px);
    border-radius: var(--pa-radius-md);
  }

  .pa-refund-head,
  .pa-refund-actions {
    padding-right: var(--pa-space-4);
    padding-left: var(--pa-space-4);
  }

  .pa-refund-body {
    display: block;
    overflow-y: auto;
    padding: var(--pa-space-3);
  }

  .pa-refund-section + .pa-refund-section {
    margin-top: var(--pa-space-3);
  }

  .pa-refund-section:first-child {
    overflow: visible;
  }

  .pa-refund-purchase {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .pa-refund-purchase-amount {
    grid-column: 2;
  }

  .pa-refund-actions {
    flex-direction: column-reverse;
  }

  .pa-refund-actions button {
    width: 100%;
  }
}