.khnqal-tags {
    font-family: sans-serif;
}
.khnqal-tags-title {
    margin: 0 0 10px;
    font-size: 14px;
    color: #333;
    font-weight: bold;
}
.khnqal-tags-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.khnqal-tag {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    background: #0073aa;
    color: #fff;
    border-radius: 4px;
    font-size: 12px;
    text-decoration: none;
    white-space: nowrap;
    flex: 0 0 auto;
    min-width: 80px;
    margin: 4px 2px;
}
.khnqal-tag:hover {
    background: #005177;
}

/* 10 màu khác nhau cho tags */
.khnqal-tag:nth-child(10n+1) { background: #e53935; } /* Đỏ */
.khnqal-tag:nth-child(10n+2) { background: #fb8c00; } /* Cam */
.khnqal-tag:nth-child(10n+3) { background: #43a047; } /* Xanh lá */
.khnqal-tag:nth-child(10n+4) { background: #1e88e5; } /* Xanh dương */
.khnqal-tag:nth-child(10n+5) { background: #8e24aa; } /* Tím */
.khnqal-tag:nth-child(10n+6) { background: #00897b; } /* Xanh ngọc */
.khnqal-tag:nth-child(10n+7) { background: #3949ab; } /* Xanh da trời */
.khnqal-tag:nth-child(10n+8) { background: #d81b60; } /* Hồng */
.khnqal-tag:nth-child(10n+9) { background: #6d4c41; } /* Nâu */
.khnqal-tag:nth-child(10n) { background: #546e7a; } /* Xám */

/* Trạng thái giới hạn - chỉ hiển thị 30 thẻ đầu */
.khnqal-tags-cloud.limited .khnqal-tag:nth-child(n+31) {
    display: none;
}

/* Khi đã expand - hiển thị tất cả */
.khnqal-tags-cloud.expanded .khnqal-tag {
    display: inline-flex !important;
}

/* Nút toggle */
.khnqal-tag-more {
    padding: 6px 12px;
    background: #fff;
    color: #0073aa;
    border: 1px solid #0073aa;
    border-radius: 4px;
    font-size: 12px;
    cursor: pointer;
    margin-top: 8px;
    font-weight: bold;
}
.khnqal-tag-more:hover {
    background: #f5f5f5;
}