:root {
  --ptxshop-color-navy-950: #0a1628;
  --ptxshop-color-navy-900: #0f1e30;
  --ptxshop-color-navy-800: #1a2e49;
  --ptxshop-color-amber-600: #d97706;
  --ptxshop-color-amber-500: #f59e0b;
  --ptxshop-color-amber-100: #fef3c7;
  --ptxshop-color-white: #ffffff;
  --ptxshop-color-surface: #f8fafc;
  --ptxshop-color-border: #e2e8f0;
  --ptxshop-color-border-strong: #cbd5e1;
  --ptxshop-color-text: #1f2937;
  --ptxshop-color-text-muted: #64748b;
  --ptxshop-color-text-faint: #94a3b8;
  --ptxshop-color-success: #15803d;
  --ptxshop-color-danger: #b91c1c;
  --ptxshop-font-body: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ptxshop-font-heading: "Barlow Condensed", Inter, system-ui, sans-serif;
  --ptxshop-text-xs: 0.75rem;
  --ptxshop-text-sm: 0.875rem;
  --ptxshop-text-md: 1rem;
  --ptxshop-text-lg: 1.125rem;
  --ptxshop-text-xl: 1.375rem;
  --ptxshop-space-2: 0.5rem;
  --ptxshop-space-3: 0.75rem;
  --ptxshop-space-4: 1rem;
  --ptxshop-space-5: 1.25rem;
  --ptxshop-space-6: 1.5rem;
  --ptxshop-space-8: 2rem;
  --ptxshop-space-10: 2.5rem;
  --ptxshop-radius-sm: 0.375rem;
  --ptxshop-radius-md: 0.5rem;
  --ptxshop-radius-lg: 0.75rem;
  --ptxshop-shadow-focus: 0 0 0 3px rgb(245 158 11 / 30%);
  --ptxshop-content-width: 1180px;
}

.ptxshop-storefront,
.ptxshop-storefront * {
  box-sizing: border-box;
}

.ptxshop-storefront {
  color: var(--ptxshop-color-text);
  font-family: var(--ptxshop-font-body);
  font-size: var(--ptxshop-text-md);
  line-height: 1.5;
}

.ptxshop-container {
  width: min(100% - 32px, var(--ptxshop-content-width));
  margin-inline: auto;
}

.ptxshop-heading {
  margin: 0;
  color: var(--ptxshop-color-navy-900);
  font-family: var(--ptxshop-font-heading);
  font-weight: 700;
  line-height: 1.08;
}

.ptxshop-eyebrow,
.ptxshop-product__sku,
.ptxshop-variant-status {
  color: var(--ptxshop-color-text-muted);
  font-size: var(--ptxshop-text-sm);
}

.ptxshop-button {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  gap: var(--ptxshop-space-2);
  padding: 0 var(--ptxshop-space-4);
  border: 1px solid transparent;
  border-radius: var(--ptxshop-radius-sm);
  font: inherit;
  font-size: var(--ptxshop-text-sm);
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}

.ptxshop-button:focus-visible,
.ptxshop-icon-button:focus-visible {
  outline: none;
  box-shadow: var(--ptxshop-shadow-focus);
}

.ptxshop-button--primary {
  background: var(--ptxshop-color-amber-500);
  color: var(--ptxshop-color-navy-950);
}

.ptxshop-button--primary:hover {
  background: var(--ptxshop-color-amber-600);
  color: var(--ptxshop-color-white);
}

.ptxshop-button--secondary {
  border-color: var(--ptxshop-color-border-strong);
  background: var(--ptxshop-color-white);
  color: var(--ptxshop-color-navy-800);
}

.ptxshop-icon-button {
  display: inline-grid;
  width: 36px;
  height: 36px;
  place-items: center;
  padding: 0;
  border: 1px solid var(--ptxshop-color-border);
  border-radius: 50%;
  background: var(--ptxshop-color-white);
  color: var(--ptxshop-color-navy-800);
  cursor: pointer;
}

.ptxshop-icon-button[aria-pressed="true"] {
  border-color: var(--ptxshop-color-amber-500);
  background: var(--ptxshop-color-amber-100);
  color: var(--ptxshop-color-amber-600);
}

.ptxshop-page-header {
  padding: var(--ptxshop-space-10) 0 var(--ptxshop-space-6);
}

.ptxshop-page-header .ptxshop-heading {
  font-size: clamp(2.4rem, 4vw, 3.6rem);
}

.ptxshop-empty-state {
  display: grid;
  gap: var(--ptxshop-space-2);
  padding: var(--ptxshop-space-8);
  border: 1px solid var(--ptxshop-color-border);
  border-radius: var(--ptxshop-radius-md);
  background: var(--ptxshop-color-surface);
  color: var(--ptxshop-color-text-muted);
}

.ptxshop-empty-state strong {
  color: var(--ptxshop-color-navy-900);
}

@media (max-width: 420px) {
  .ptxshop-container {
    width: min(100% - 24px, var(--ptxshop-content-width));
  }
}
