/**
 * 텍스트 비교·Diff - 개별 스타일
 */

/* 텍스트 통계 */
.text-stats {
    display: flex;
    gap: var(--spacing-lg);
    margin-top: var(--spacing-sm);
    font-size: var(--text-xs);
    color: var(--text-muted);
}

.text-stats strong {
    color: var(--accent-primary);
    font-family: var(--font-mono);
}

/* 옵션 그리드 */
.options-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--spacing-lg);
}

.option-group h4 {
    font-size: var(--text-sm);
    color: var(--accent-primary);
    margin-bottom: var(--spacing-sm);
    font-weight: 600;
}

.option-group .checkbox-tool {
    margin-bottom: var(--spacing-xs);
    font-size: var(--text-sm);
}

.range-wrapper {
    margin-bottom: var(--spacing-md);
}

.range-wrapper label {
    display: block;
    font-size: var(--text-sm);
    color: var(--text-secondary);
    margin-bottom: var(--spacing-xs);
}

.range-wrapper strong {
    color: var(--accent-primary);
}

/* 접기 아이콘 */
.collapse-icon {
    transition: transform 0.3s ease;
}

[aria-expanded="true"] .collapse-icon {
    transform: rotate(180deg);
}

/* 액션 버튼 */
.action-buttons {
    display: flex;
    justify-content: center;
    gap: var(--spacing-md);
    margin: var(--spacing-xl) 0;
}

/* 통계 카드 */
.stats-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-xl);
}

.stat-card {
    text-align: center;
    padding: var(--spacing-lg);
    border-radius: var(--radius-md);
    background: #f2f4f7;
    border: 1px solid var(--border-color-light);
}

.stat-card.primary {
    border-color: var(--accent-primary);
    background: rgba(59, 111, 224, 0.1);
}

.stat-card.success {
    border-color: var(--accent-success);
    background: rgba(16, 185, 129, 0.1);
}

.stat-card.warning {
    border-color: var(--accent-warning);
    background: rgba(245, 158, 11, 0.1);
}

.stat-card.info {
    border-color: var(--accent-secondary);
    background: rgba(139, 92, 246, 0.1);
}

.stat-card .stat-value {
    font-size: var(--text-2xl);
    font-weight: 700;
    font-family: var(--font-mono);
}

.stat-card.primary .stat-value { color: var(--accent-primary); }
.stat-card.success .stat-value { color: var(--accent-success); }
.stat-card.warning .stat-value { color: var(--accent-warning); }
.stat-card.info .stat-value { color: var(--accent-secondary); }

.stat-card .stat-label {
    font-size: var(--text-sm);
    color: var(--text-muted);
    margin-top: var(--spacing-xs);
}

/* 비교 결과 */
.comparison-result {
    min-height: 200px;
    max-height: 400px;
    overflow: auto;
    padding: var(--spacing-md);
    background: #eef0f4;
    border-radius: var(--radius-sm);
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    line-height: 1.6;
    white-space: pre-wrap;
    word-break: break-all;
}

.unified-comparison {
    min-height: 200px;
    max-height: 500px;
    overflow: auto;
    font-family: var(--font-mono);
    font-size: var(--text-sm);
}

/* Diff 하이라이트 */
.diff-added {
    background: rgba(16, 185, 129, 0.3);
    color: #1f7a48;
}

.diff-removed {
    background: rgba(239, 68, 68, 0.3);
    color: #b3372c;
    text-decoration: line-through;
}

.diff-changed {
    background: rgba(245, 158, 11, 0.3);
    color: #96521f;
}

/* 섹션 패딩 제거 */
.section-content.p-0 {
    padding: 0;
}

/* 반응형 */
@media (max-width: 992px) {
    .options-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .stats-cards {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 576px) {
    .options-grid {
        grid-template-columns: 1fr;
    }
    
    .stats-cards {
        grid-template-columns: 1fr;
    }
    
    .action-buttons {
        flex-direction: column;
        align-items: center;
    }
}
