| 1 | .badge { |
| 2 | display: inline-block; |
| 3 | padding: 2px var(--space-2); |
| 4 | border-radius: var(--radius-full); |
| 5 | font-size: var(--text-xs); |
| 6 | font-weight: 500; |
| 7 | margin-left: var(--space-2); |
| 8 | vertical-align: middle; |
| 9 | } |
| 10 | .badge-press { |
| 11 | background-color: var(--color-accent-muted); |
| 12 | color: var(--color-accent); |
| 13 | border: 1px solid color-mix(in srgb, var(--color-accent) 35%, var(--color-border)); |
| 14 | } |
| 15 | .badge-organic { |
| 16 | background-color: color-mix(in srgb, var(--color-success) 12%, var(--color-surface)); |
| 17 | color: var(--color-success); |
| 18 | border: 1px solid color-mix(in srgb, var(--color-success) 35%, var(--color-border)); |
| 19 | } |
| 20 | .badge-hype { |
| 21 | background-color: color-mix(in srgb, var(--color-danger) 10%, var(--color-surface)); |
| 22 | color: var(--color-danger); |
| 23 | border: 1px solid color-mix(in srgb, var(--color-danger) 35%, var(--color-border)); |
| 24 | } |