/**
 * SVX Post Classes CSS
 * 
 * CSS for automatic height classes assigned to posts based on title word count.
 * 
 * @package wp.plugin.svx
 * @version 1.0.0
 * @author SV Agency
 */

/* ==========================================================================
   Post Height Classes (based on title word count)
   ========================================================================== */

/* Short posts (0-20 title words) - 90px height */
.svx-height-90,
.svx-tit-short,
.svx-post-short,
.svx-testimonial-short {
    height: 90px !important;
    min-height: 90px !important;
    max-height: 90px !important;
}

/* Medium posts (21-50 title words) - 180px height */
.svx-height-180,
.svx-tit-medium,
.svx-post-medium,
.svx-testimonial-medium {
    height: 180px !important;
    min-height: 180px !important;
    max-height: 180px !important;
}

/* Long posts (51+ title words) - 270px height */
.svx-height-270,
.svx-tit-long,
.svx-post-long,
.svx-testimonial-long {
    height: 270px !important;
    min-height: 270px !important;
    max-height: 270px !important;
}

/* ==========================================================================
   Post Size Classes (for additional styling)
   ========================================================================== */

.svx-tit-short,
.svx-post-short,
.svx-testimonial-short {
    /* Additional styling for short posts */
    font-size: 0.9em;
    line-height: 1.3;
}

.svx-tit-medium,
.svx-post-medium,
.svx-testimonial-medium {
    /* Additional styling for medium posts */
    font-size: 1em;
    line-height: 1.4;
}

.svx-tit-long,
.svx-post-long,
.svx-testimonial-long {
    /* Additional styling for long posts */
    font-size: 1.1em;
    line-height: 1.5;
}

/* ==========================================================================
   Responsive Adjustments
   ========================================================================== */

@media (max-width: 768px) {
    /* Mobile adjustments */
    .svx-height-90,
    .svx-tit-short,
    .svx-post-short,
    .svx-testimonial-short {
        height: 120px !important;
        min-height: 120px !important;
        max-height: 120px !important;
    }
    
    .svx-height-180,
    .svx-tit-medium,
    .svx-post-medium,
    .svx-testimonial-medium {
        height: 200px !important;
        min-height: 200px !important;
        max-height: 200px !important;
    }
    
    .svx-height-270,
    .svx-tit-long,
    .svx-post-long,
    .svx-testimonial-long {
        height: 280px !important;
        min-height: 280px !important;
        max-height: 280px !important;
    }
    
    /* Mobile text scaling adjustments */
    body.svx-text-scaling-enabled .svx-height-90 blockquote,
    body.svx-text-scaling-enabled .svx-height-90 .testimonial-quote {
        font-size: 0.8rem !important;
        padding: 10px 14px !important;
    }
    
    body.svx-text-scaling-enabled .svx-height-90 blockquote h4,
    body.svx-text-scaling-enabled .svx-height-90 .testimonial-quote h4,
    body.svx-text-scaling-enabled .svx-height-90 .testimonial-title {
        font-size: 0.85rem !important;
    }
    
    body.svx-text-scaling-enabled .svx-height-180 blockquote,
    body.svx-text-scaling-enabled .svx-height-180 .testimonial-quote {
        font-size: 0.95rem !important;
        padding: 14px 18px !important;
    }
    
    body.svx-text-scaling-enabled .svx-height-180 blockquote h4,
    body.svx-text-scaling-enabled .svx-height-180 .testimonial-quote h4,
    body.svx-text-scaling-enabled .svx-height-180 .testimonial-title {
        font-size: 1.05rem !important;
    }
    
    body.svx-text-scaling-enabled .svx-height-270 blockquote,
    body.svx-text-scaling-enabled .svx-height-270 .testimonial-quote {
        font-size: 1.05rem !important;
        padding: 18px 22px !important;
    }
    
    body.svx-text-scaling-enabled .svx-height-270 blockquote h4,
    body.svx-text-scaling-enabled .svx-height-270 .testimonial-quote h4,
    body.svx-text-scaling-enabled .svx-height-270 .testimonial-title {
        font-size: 1.15rem !important;
    }
}

@media (max-width: 480px) {
    /* Small mobile adjustments */
    .svx-height-90,
    .svx-tit-short,
    .svx-post-short,
    .svx-testimonial-short {
        height: 100px !important;
        min-height: 100px !important;
        max-height: 100px !important;
    }
    
    .svx-height-180,
    .svx-tit-medium,
    .svx-post-medium,
    .svx-testimonial-medium {
        height: 160px !important;
        min-height: 160px !important;
        max-height: 160px !important;
    }
    
    .svx-height-270,
    .svx-tit-long,
    .svx-post-long,
    .svx-testimonial-long {
        height: 240px !important;
        min-height: 240px !important;
        max-height: 240px !important;
    }
    
    /* Small mobile text scaling adjustments */
    body.svx-text-scaling-enabled .svx-height-90 blockquote,
    body.svx-text-scaling-enabled .svx-height-90 .testimonial-quote {
        font-size: 0.7rem !important;
        padding: 6px 10px !important;
    }
    
    body.svx-text-scaling-enabled .svx-height-90 blockquote h4,
    body.svx-text-scaling-enabled .svx-height-90 .testimonial-quote h4,
    body.svx-text-scaling-enabled .svx-height-90 .testimonial-title {
        font-size: 0.75rem !important;
    }
    
    body.svx-text-scaling-enabled .svx-height-180 blockquote,
    body.svx-text-scaling-enabled .svx-height-180 .testimonial-quote {
        font-size: 0.8rem !important;
        padding: 8px 12px !important;
    }
    
    body.svx-text-scaling-enabled .svx-height-180 blockquote h4,
    body.svx-text-scaling-enabled .svx-height-180 .testimonial-quote h4,
    body.svx-text-scaling-enabled .svx-height-180 .testimonial-title {
        font-size: 0.85rem !important;
    }
    
    body.svx-text-scaling-enabled .svx-height-270 blockquote,
    body.svx-text-scaling-enabled .svx-height-270 .testimonial-quote {
        font-size: 0.9rem !important;
        padding: 12px 16px !important;
    }
    
    body.svx-text-scaling-enabled .svx-height-270 blockquote h4,
    body.svx-text-scaling-enabled .svx-height-270 .testimonial-quote h4,
    body.svx-text-scaling-enabled .svx-height-270 .testimonial-title {
        font-size: 0.95rem !important;
    }
}

/* ==========================================================================
   Visual Sorting and Alignment Borders
   ========================================================================== */

/* Red borders for visual sorting and alignment */
.svx-height-90,
.svx-height-180,
.svx-height-270,
.svx-tit-short,
.svx-tit-medium,
.svx-tit-long,
.svx-post-short,
.svx-post-medium,
.svx-post-long,
.svx-testimonial-short,
.svx-testimonial-medium,
.svx-testimonial-long {
   
    box-sizing: border-box !important;
}

/* Different border colors for different height classes */
.svx-height-90,
.svx-tit-short,
.svx-post-short,
.svx-testimonial-short {
    border-color: #ff0000 !important; /* Red for short (90px) */
}

.svx-height-180,
.svx-tit-medium,
.svx-post-medium,
.svx-testimonial-medium {
    border-color: #ff8800 !important; /* Orange for medium (180px) */
}

.svx-height-270,
.svx-tit-long,
.svx-post-long,
.svx-testimonial-long {
    border-color: #ff0088 !important; /* Pink for long (270px) */
}

/* ==========================================================================
   Integration with existing post styles
   ========================================================================== */

/* Ensure height classes work with existing layouts */
.sv-testimonial.svx-height-90,
.sv-testimonial.svx-height-180,
.sv-testimonial.svx-height-270,
.grid-item.svx-height-90,
.grid-item.svx-height-180,
.grid-item.svx-height-270 {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* Adjust content within height-constrained posts */
.svx-height-90 .testimonial-content,
.svx-height-180 .testimonial-content,
.svx-height-270 .testimonial-content,
.svx-height-90 .post-content,
.svx-height-180 .post-content,
.svx-height-270 .post-content {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.svx-height-90 .testimonial-content,
.svx-height-90 .post-content {
    -webkit-line-clamp: 2;
}

.svx-height-270 .testimonial-content,
.svx-height-270 .post-content {
    -webkit-line-clamp: 4;
}

/* ==========================================================================
   Text Scaling for Blockquotes (Conditional)
   ========================================================================== */

/* Scale text to fit within height-constrained blockquotes - only when enabled */
body.svx-text-scaling-enabled .svx-height-90 blockquote,
body.svx-text-scaling-enabled .svx-height-90 .testimonial-quote {
    font-size: 0.75rem !important;
    line-height: 1.2 !important;
    padding: 8px 12px !important;
}

body.svx-text-scaling-enabled .svx-height-90 blockquote h4,
body.svx-text-scaling-enabled .svx-height-90 .testimonial-quote h4,
body.svx-text-scaling-enabled .svx-height-90 .testimonial-title {
    font-size: 0.8rem !important;
    line-height: 1.1 !important;
    margin: 0 0 4px 0 !important;
}

body.svx-text-scaling-enabled .svx-height-90 blockquote p,
body.svx-text-scaling-enabled .svx-height-90 .testimonial-quote p,
body.svx-text-scaling-enabled .svx-height-90 .testimonial-author-details {
    font-size: 0.7rem !important;
    line-height: 1.1 !important;
    margin: 0 !important;
}

body.svx-text-scaling-enabled .svx-height-180 blockquote,
body.svx-text-scaling-enabled .svx-height-180 .testimonial-quote {
    font-size: 0.9rem !important;
    line-height: 1.3 !important;
    padding: 12px 16px !important;
}

body.svx-text-scaling-enabled .svx-height-180 blockquote h4,
body.svx-text-scaling-enabled .svx-height-180 .testimonial-quote h4,
body.svx-text-scaling-enabled .svx-height-180 .testimonial-title {
    font-size: 1rem !important;
    line-height: 1.2 !important;
    margin: 0 0 6px 0 !important;
}

body.svx-text-scaling-enabled .svx-height-180 blockquote p,
body.svx-text-scaling-enabled .svx-height-180 .testimonial-quote p,
body.svx-text-scaling-enabled .svx-height-180 .testimonial-author-details {
    font-size: 0.8rem !important;
    line-height: 1.2 !important;
    margin: 0 !important;
}

body.svx-text-scaling-enabled .svx-height-270 blockquote,
body.svx-text-scaling-enabled .svx-height-270 .testimonial-quote {
    font-size: 1rem !important;
    line-height: 1.4 !important;
    padding: 16px 20px !important;
}

body.svx-text-scaling-enabled .svx-height-270 blockquote h4,
body.svx-text-scaling-enabled .svx-height-270 .testimonial-quote h4,
body.svx-text-scaling-enabled .svx-height-270 .testimonial-title {
    font-size: 1.1rem !important;
    line-height: 1.3 !important;
    margin: 0 0 8px 0 !important;
}

body.svx-text-scaling-enabled .svx-height-270 blockquote p,
body.svx-text-scaling-enabled .svx-height-270 .testimonial-quote p,
body.svx-text-scaling-enabled .svx-height-270 .testimonial-author-details {
    font-size: 0.9rem !important;
    line-height: 1.3 !important;
    margin: 0 !important;
}