/* Unified chip styles for tags and categories across all views */

/* Tag chips - pastel green */
.tag-chip,
.entry-tag,
.photo-tag,
.tag-item {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    background-color: var(--green-pastel);
    color: var(--color-text);
    padding: 0.125rem 0.75rem;
    border: 1px solid var(--pill-border);
    border-radius: 12px;
    text-decoration: none;
    font-size: 0.875rem;
}

/* Category chips - pastel blue */
.category-chip,
.entry-category > a:first-child,
.category-name {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    background-color: var(--blue-pastel);
    color: var(--color-text);
    padding: 0.125rem 0.75rem;
    border: 1px solid var(--pill-border);
    border-radius: 12px;
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 500;
}

/* Gallery chips - pastel purple */
.gallery-chip,
.gallery-name {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    background-color: var(--purple-pastel);
    color: var(--color-text);
    padding: 0.125rem 0.75rem;
    border: 1px solid var(--pill-border);
    border-radius: 12px;
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 500;
}

/* Remove all hover effects for chips */
.tag-chip:hover,
.entry-tag:hover,
.photo-tag:hover,
.tag-item:hover,
.category-chip:hover,
.entry-category > a:first-child:hover,
.category-name:hover,
.gallery-chip:hover,
.gallery-name:hover {
    /* No hover changes - chips stay the same */
    background-color: inherit;
    color: inherit;
    border-color: inherit;
    text-decoration: none;
    transform: none;
}

/* Special case for tag autocomplete items with remove button */
.tag-item .tag-remove {
    background: none;
    border: none;
    color: var(--color-text);
    cursor: pointer;
    font-size: 1rem;
    padding: 0 0.25rem;
    margin-left: 0.25rem;
    opacity: 0.7;
}

.tag-item .tag-remove:hover {
    opacity: 1;
    background-color: rgba(0, 0, 0, 0.1);
    border-radius: 4px;
}