/* Zizania — Chips (reusable component) */
.zz-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.625rem;
    justify-content: center;
    align-items: center;
}
.zz-chips--start { justify-content: flex-start; }
.zz-chips--end   { justify-content: flex-end; }

.zz-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    border-radius: var(--radius-full);
    background-color: var(--surface-container-lowest);
    color: var(--on-surface);
    font-family: var(--font-sans);
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.2;
    letter-spacing: 0;
    white-space: nowrap;
    box-shadow: 0 1px 2px rgba(29, 27, 23, 0.04);
    transition: transform 300ms ease-in-out, box-shadow 300ms ease-in-out;
}

.zz-chip__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    line-height: 1;
}

.zz-chip--primary {
    background-color: var(--primary);
    color: var(--on-primary);
}
.zz-chip--secondary {
    background-color: var(--secondary);
    color: var(--on-surface);
}
.zz-chip--tertiary {
    background-color: var(--tertiary);
    color: #fef8f1;
}

a.zz-chip:hover,
a.zz-chip:focus-visible {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(29, 27, 23, 0.08);
    text-decoration: none;
}