/**
 * YGT Toolkit - Frontend Styles
 * 
 * Minimal CSS - Most styles are inline for performance
 * 
 * @package YGT_Toolkit
 * @version 1.2.1
 */

.comments-list,
.comments-list .comments-list {
    max-height: none !important;
    height: auto !important;
    overflow: visible !important;
    display: block !important;
}

.comments-list .comments-list__item {
    display: list-item !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Delayed Ads - Fade in animation */
@keyframes ygt-fade-in {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.ygt-ad-visible {
    animation: ygt-fade-in 0.5s ease-out forwards;
}

/* Comment badges - Already handled inline but extra utilities here */
.ygt-has-badge .comment-author-name,
.ygt-has-badge .comment-author {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
}

/* Dark mode support */
@media (prefers-color-scheme: dark) {
    .ygt-comment-admin {
        background: linear-gradient(90deg, rgba(255, 215, 0, 0.1) 0%, transparent 100%);
    }
    
    .ygt-comment-author {
        background: linear-gradient(90deg, rgba(102, 126, 234, 0.1) 0%, transparent 100%);
    }
}

/* Reduce motion for accessibility */
@media (prefers-reduced-motion: reduce) {
    .ygt-ad-visible {
        animation: none;
    }
    
    .ygt-comment-badge {
        transition: none;
    }
}