/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/


@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/


}
/* =================================================================
   TÙY CHỈNH CARD UI BLOG (Đạt hiệu ứng Ngày/Tháng tách biệt)
   ================================================================= */

/* 1. Thiết lập Flexbox cho cột Ngày/Tháng và Nội dung */
.custom-meta-content-row {
    display: flex; 
    align-items: flex-start; /* Căn chỉnh nội dung lên trên cùng */
    padding-top: 15px;
    padding-left: 15px; /* Thêm padding trái nếu cần */
    padding-right: 15px; /* Thêm padding phải nếu cần */
}

/* 2. Cột Ngày/Tháng (Cột Trái) */
.custom-date-box {
    flex-shrink: 0; /* Không cho cột này co lại */
    width: 70px; /* Độ rộng cố định cho Ngày/Tháng */
    text-align: center;
    margin-right: 15px; /* Khoảng cách với khối nội dung */
    font-family: sans-serif; /* Chọn font chữ phù hợp */
    line-height: 1.1;
}

.custom-date-box .day {
    display: block;
    font-size: 2em; /* Ngày lớn */
    font-weight: bold;
    color: #007bff; /* Màu chữ ngày */
}

.custom-date-box .month-year {
    display: block;
    font-size: 0.85em; /* Tháng/Năm nhỏ */
    opacity: 0.7;
    color: #000000; 
}

/* 3. Cột Nội dung (Cột Phải) */
.custom-text-content {
    flex-grow: 1; /* Chiếm hết không gian còn lại */
}

.entry-title-custom {
    /* Style Tiêu đề (in đậm như hình) */
    font-weight: 800; 
    font-size: 1.25em; 
    line-height: 1.3;
    margin-top: 0; /* Loại bỏ margin-top mặc định */
}

/* 4. Tùy chỉnh thêm (ví dụ: Tóm tắt, Nút Read More, v.v.) */
.custom-text-content .entry-summary {
    font-size: 0.9em;
}