/* === Material Design 3 Components === */

/* Chips */
.chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 8px;
    font: var(--label-small);
    text-decoration: none;
    cursor: pointer;
    transition: all var(--duration-short4) var(--easing-standard);
    border: 1px solid transparent;
    white-space: nowrap;
}

.chip.elevated {
    background-color: var(--surface-container-low);
    color: var(--on-surface);
    box-shadow: var(--shadow-1);
}

.chip.elevated:hover {
    background-color: var(--surface-container-high);
    box-shadow: var(--shadow-2);
}

.flex { display: flex; }

.hidden { display: none; }