@layer components{.payment-notice{--payment-accent:var(--primary);border:1px solid color-mix(in srgb, var(--payment-accent) 35%, var(--border));border-inline-start:6px solid var(--payment-accent);border-radius:var(--radius);background:color-mix(in srgb, var(--payment-accent) 7%, var(--card));width:100%;color:var(--foreground);align-items:flex-start;gap:1rem;padding:1.5rem;display:flex}.payment-notice[data-state=paid]{--payment-accent:oklch(52% .14 150)}.payment-notice[data-state=delayed]{--payment-accent:oklch(64% .15 75)}.payment-notice[data-state=error],.payment-notice[data-state=failed]{--payment-accent:var(--destructive)}.payment-notice[data-state=canceled],.payment-notice[data-state=refunded],.payment-notice[data-state=partially_refunded]{--payment-accent:var(--muted-foreground)}.payment-notice-icon{width:3rem;height:3rem;color:var(--payment-accent);background:color-mix(in srgb, var(--payment-accent) 12%, var(--card));border-radius:999px;flex:0 0 3rem;place-items:center;display:grid}.payment-notice-icon svg{width:1.75rem;height:1.75rem}.payment-notice-content{flex:1;min-width:0}.payment-notice-title{text-wrap:balance;margin:0;font-size:1.5rem;font-weight:700;line-height:1.35}.payment-notice-description,.payment-notice-detail{margin:.5rem 0 0;line-height:1.6}.payment-notice-description{font-size:1rem}.payment-notice-detail{font-size:.875rem}.payment-notice-actions{flex-wrap:wrap;gap:.75rem;margin-top:1.25rem;display:flex}.payment-notice-spinner{animation:1s linear infinite payment-notice-spin}@keyframes payment-notice-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.payment-notice-spinner{animation:none}}@media (width<=26rem){.payment-notice{gap:.75rem;padding:1rem}.payment-notice-icon{flex-basis:2rem;width:2rem;height:2rem}.payment-notice-icon svg{width:1.5rem;height:1.5rem}.payment-notice-title{font-size:1.25rem}}}