/* 
 * tag/category.css
 * 카테고리 트리 스타일 - 프레임워크 독립적
 */

/* 카테고리 트리 컨테이너 */
.category-tree {
    font-size: var(--font-size-sm);
    line-height: var(--line-height-base);
    min-height: 120px; /* 초기 높이 설정으로 깜빡임 방지 */
    transition: min-height var(--transition-slow);
    position: relative;
    z-index: var(--z-dropdown);
}

/* 카테고리 노드 */
.category-node {
    margin: var(--spacing-xs) 0;
}

/* 카테고리 아이템 */
.category-item {
    display: flex;
    align-items: center;
    margin: var(--spacing-xs) 0;
    line-height: var(--line-height-base);
}

/* 카테고리 링크 */
.category-link {
    display: block;
    padding: var(--spacing-sm) var(--spacing-sm);
    color: var(--text-primary);
    text-decoration: none;
    border-left: 2px solid transparent;
    border-radius: var(--border-radius-sm);
    transition: all var(--transition-base);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.category-link:hover {
    color: var(--color-primary);
    background-color: rgba(var(--color-primary-rgb), 0.08);
    border-left-color: var(--color-primary);
    text-decoration: none;
}

/* 특별한 카테고리 링크 (모두보기, 고정된 포스트) */
.category-special .category-link {
    font-weight: var(--font-weight-semibold);
}

.category-special .category-name {
    font-weight: var(--font-weight-semibold);
}

.category-special .category-name i {
    font-size: var(--font-size-sm);
    opacity: 0.8;
    transition: opacity var(--transition-base);
}

.category-special .category-link:hover .category-name i {
    opacity: 1;
}

.category-name {
    font-weight: var(--font-weight-medium);
    margin-right: var(--spacing-sm);
}

.category-count {
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    font-weight: var(--font-weight-semibold);
    margin-left: auto;
}

/* 카테고리 레벨별 들여쓰기 */
.category-level-0 {
    padding-left: 0;
}

.category-level-0 .category-link {
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-base);
}

.category-level-0 .category-name {
    font-size: var(--font-size-base);
}

.category-level-1 {
    padding-left: var(--spacing-md);
}

.category-level-2 {
    padding-left: var(--spacing-lg);
}

.category-level-3 {
    padding-left: var(--spacing-xl);
}

.category-level-4 {
    padding-left: var(--spacing-xxl);
}

.category-level-5 {
    padding-left: calc(var(--spacing-xxl) + var(--spacing-md));
}

/* 카테고리 상태 메시지 */
.category-empty,
.category-error {
    text-align: center;
    padding: var(--spacing-md);
    color: var(--text-secondary);
    font-size: var(--font-size-sm);
}

.category-error {
    color: var(--color-danger);
}

.category-error i {
    margin-right: var(--spacing-sm);
}

/* 반응형 조정 */
@media (max-width: 991.98px) {
    .category-tree {
        font-size: var(--font-size-xs);
    }
    
    .category-level-1 { padding-left: var(--spacing-md); }
    .category-level-2 { padding-left: var(--spacing-lg); }
    .category-level-3 { padding-left: var(--spacing-xl); }
    .category-level-4 { padding-left: var(--spacing-xxl); }
    .category-level-5 { padding-left: calc(var(--spacing-xxl) + var(--spacing-md)); }
}

/* 다크 모드 */
[data-theme="dark"] .category-link,
[data-bs-theme="dark"] .category-link {
    color: var(--text-primary);
}

[data-theme="dark"] .category-link:hover,
[data-bs-theme="dark"] .category-link:hover {
    color: var(--color-primary);
    background-color: rgba(var(--color-primary-rgb), 0.1);
}

[data-theme="dark"] .category-count,
[data-bs-theme="dark"] .category-count {
    color: var(--text-secondary);
}

[data-theme="dark"] .category-error,
[data-bs-theme="dark"] .category-error {
    color: var(--color-danger);
}

