/* categories.css - 分类云样式 */
#categories {
    padding: 20px 0;
}

.category-cloud {
    text-align: center;
    margin-top: 30px;
    padding: 20px 0;
    visibility: visible !important;
}

.category-cloud a {
    display: inline-block;
    text-decoration: none;
    font-weight: 500;
    cursor: pointer;
    padding: 6px 12px;
    margin: 8px;
    border-radius: 20px;
    transition: all 0.3s ease;
    position: relative;
    background: rgba(0, 0, 0, 0.03);
    border: 1px solid rgba(0, 0, 0, 0.08);
}

/* 分类悬停效果 */
.category-cloud a:hover {
    transform: translateY(-2px) scale(1.05);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    opacity: 0.9;
}

/* 不同文章数量的分类样式 - 根据数量分级 */
.category-cloud a[data-count="0"],
.category-cloud a[data-count="1"],
.category-cloud a[data-count="2"] {
    color: #6c757d;
    font-size: 14px;
    background: rgba(108, 117, 125, 0.08);
    border-color: rgba(108, 117, 125, 0.15);
}

.category-cloud a[data-count="3"],
.category-cloud a[data-count="4"],
.category-cloud a[data-count="5"] {
    color: #17a2b8;
    font-size: 16px;
    background: rgba(23, 162, 184, 0.1);
    border-color: rgba(23, 162, 184, 0.2);
}

.category-cloud a[data-count="6"],
.category-cloud a[data-count="7"],
.category-cloud a[data-count="8"] {
    color: #28a745;
    font-size: 18px;
    background: rgba(40, 167, 69, 0.1);
    border-color: rgba(40, 167, 69, 0.2);
}

.category-cloud a[data-count="9"],
.category-cloud a[data-count="10"],
.category-cloud a[data-count="11"] {
    color: #007bff;
    font-size: 20px;
    background: rgba(0, 123, 255, 0.1);
    border-color: rgba(0, 123, 255, 0.2);
}

.category-cloud a[data-count="12"],
.category-cloud a[data-count="13"],
.category-cloud a[data-count="14"] {
    color: #fd7e14;
    font-size: 22px;
    background: rgba(253, 126, 20, 0.1);
    border-color: rgba(253, 126, 20, 0.2);
}

.category-cloud a[data-count="15"],
.category-cloud a[data-count="16"],
.category-cloud a[data-count="17"] {
    color: #e83e8c;
    font-size: 24px;
    background: rgba(232, 62, 140, 0.1);
    border-color: rgba(232, 62, 140, 0.2);
    font-weight: 600;
}

.category-cloud a[data-count="18"],
.category-cloud a[data-count="19"],
.category-cloud a[data-count="20"] {
    color: #6f42c1;
    font-size: 26px;
    background: rgba(111, 66, 193, 0.1);
    border-color: rgba(111, 66, 193, 0.2);
    font-weight: 600;
}

.category-cloud a[data-count="21"],
.category-cloud a[data-count="22"],
.category-cloud a[data-count="23"] {
    color: #dc3545;
    font-size: 28px;
    background: rgba(220, 53, 69, 0.1);
    border-color: rgba(220, 53, 69, 0.2);
    font-weight: 700;
}

.category-cloud a[data-count="24"],
.category-cloud a[data-count="25"],
.category-cloud a[data-count="26"],
.category-cloud a[data-count="27"],
.category-cloud a[data-count="28"],
.category-cloud a[data-count="29"],
.category-cloud a[data-count="30"] {
    color: #d63384;
    font-size: 30px;
    background: rgba(214, 51, 132, 0.1);
    border-color: rgba(214, 51, 132, 0.2);
    font-weight: 700;
}

/* 悬停时的颜色增强效果 */
.category-cloud a[data-count="0"]:hover,
.category-cloud a[data-count="1"]:hover,
.category-cloud a[data-count="2"]:hover {
    color: #5a6268;
}

.category-cloud a[data-count="3"]:hover,
.category-cloud a[data-count="4"]:hover,
.category-cloud a[data-count="5"]:hover {
    color: #138496;
}

.category-cloud a[data-count="6"]:hover,
.category-cloud a[data-count="7"]:hover,
.category-cloud a[data-count="8"]:hover {
    color: #218838;
}

.category-cloud a[data-count="9"]:hover,
.category-cloud a[data-count="10"]:hover,
.category-cloud a[data-count="11"]:hover {
    color: #0069d9;
}

.category-cloud a[data-count="12"]:hover,
.category-cloud a[data-count="13"]:hover,
.category-cloud a[data-count="14"]:hover {
    color: #e96b02;
}

.category-cloud a[data-count="15"]:hover,
.category-cloud a[data-count="16"]:hover,
.category-cloud a[data-count="17"]:hover {
    color: #d63384;
}

.category-cloud a[data-count="18"]:hover,
.category-cloud a[data-count="19"]:hover,
.category-cloud a[data-count="20"]:hover {
    color: #5a32a3;
}

.category-cloud a[data-count="21"]:hover,
.category-cloud a[data-count="22"]:hover,
.category-cloud a[data-count="23"]:hover {
    color: #c82333;
}

.category-cloud a[data-count="24"]:hover,
.category-cloud a[data-count="25"]:hover,
.category-cloud a[data-count="26"]:hover,
.category-cloud a[data-count="27"]:hover,
.category-cloud a[data-count="28"]:hover,
.category-cloud a[data-count="29"]:hover,
.category-cloud a[data-count="30"]:hover {
    color: #b02a6e;
}

/* 响应式设计 */
@media (max-width: 768px) {
    .category-cloud {
        padding: 15px 0;
    }
    
    .category-cloud a {
        margin: 5px;
        padding: 5px 10px;
    }
    
    .category-cloud a[data-count="0"],
    .category-cloud a[data-count="1"],
    .category-cloud a[data-count="2"] { font-size: 12px; }
    
    .category-cloud a[data-count="3"],
    .category-cloud a[data-count="4"],
    .category-cloud a[data-count="5"] { font-size: 14px; }
    
    .category-cloud a[data-count="6"],
    .category-cloud a[data-count="7"],
    .category-cloud a[data-count="8"] { font-size: 16px; }
    
    .category-cloud a[data-count="9"],
    .category-cloud a[data-count="10"],
    .category-cloud a[data-count="11"] { font-size: 18px; }
    
    .category-cloud a[data-count="12"],
    .category-cloud a[data-count="13"],
    .category-cloud a[data-count="14"] { font-size: 20px; }
    
    .category-cloud a[data-count="15"],
    .category-cloud a[data-count="16"],
    .category-cloud a[data-count="17"] { font-size: 22px; }
    
    .category-cloud a[data-count="18"],
    .category-cloud a[data-count="19"],
    .category-cloud a[data-count="20"] { font-size: 24px; }
    
    .category-cloud a[data-count="21"],
    .category-cloud a[data-count="22"],
    .category-cloud a[data-count="23"] { font-size: 26px; }
    
    .category-cloud a[data-count="24"],
    .category-cloud a[data-count="25"],
    .category-cloud a[data-count="26"],
    .category-cloud a[data-count="27"],
    .category-cloud a[data-count="28"],
    .category-cloud a[data-count="29"],
    .category-cloud a[data-count="30"] { font-size: 28px; }
}