/* File: assets/css/lelib-layout.css */

/* Layout khung sườn */
.tv-layout { 
    display: grid; 
    gap: 24px; 
    align-items: start; 
    
    /* Thiết lập kích thước mặc định */
    grid-template-columns: 280px 1fr; 
    
    /* Hiệu ứng chuyển động mượt cho Grid */
    transition: 
        grid-template-columns 0.5s cubic-bezier(0.4, 0, 0.2, 1), 
        gap 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Khi đóng lại: Cột đầu tiên về 0px, khoảng cách (gap) về 0 */
.tv-layout.is-collapsed { 
    grid-template-columns: 0px 1fr; 
    gap: 0; 
}

#tv-list-wrap { 
    position: relative; 
    min-height: 300px; 
}

.tv-main { 
    min-width: 0; 
    transition: width 0.5s ease; /* Mượt mà cho phần nội dung chính */
}

/* Responsive Mobile */
@media (max-width: 768px) {
    .tv-layout { 
        display: flex; 
        flex-direction: column; 
        gap: 24px; 
    }
    
    /* Trên mobile, khi đóng thì ẩn hoàn toàn */
    .tv-layout.is-collapsed .tv-sidebar { 
        display: none; 
    }
}