/*
Theme Name: HappySunny
Theme URI: Đang cập nhật ...
Author: Kien Dinh
Author URI: Đang cập nhật ...
Description: We are make one world with slogan win - win
Version: 1.8
Tags: blog, two-columns, left-sidebar, accessibility-ready, custom-background, custom-colors, custom-header, custom-logo, custom-menu, editor-style, featured-images, microformats, post-formats, rtl-language-support, sticky-post, threaded-comments, translation-ready
*/
/* --- Author Box Styles --- */
.modern-author-box {
    display: flex; /* Sử dụng Flexbox để căn chỉnh avatar và thông tin */
    align-items: center; /* Căn giữa theo chiều dọc */
    background-color: #d9d5d5; /* Nền nhẹ nhàng theo biến */
    border: 1px solid var(--dark-divider-color); /* Đường viền tinh tế theo biến */
    border-radius: 10px; /* Bo góc nhẹ */
    padding: 25px 30px; /* Khoảng cách bên trong */
    margin-top: 40px; /* Khoảng cách với nội dung phía trên */
    box-shadow: 0 5px 15px var(--box-shadow-color); /* Đổ bóng nhẹ nhàng theo biến */
    transition: all 0.3s ease; /* Hiệu ứng chuyển động mượt mà khi hover */
    color:#000;
}

.modern-author-box:hover {
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12); /* Có thể giữ lại màu này hoặc dùng biến */
    transform: translateY(-3px); /* Nhấc nhẹ lên khi hover */
}

.modern-author-box .author-avatar {
    flex-shrink: 0; /* Ngăn avatar bị co lại */
    margin-right: 25px; /* Khoảng cách giữa avatar và thông tin */
    position: relative;
    width: 120px; /* Đảm bảo kích thước cố định */
    height: 120px; /* Đảm bảo kích thước cố định */
}

.modern-author-box .author-avatar img {
    border-radius: 50%; /* Bo tròn avatar */
    border: 4px solid var(--white-color); /* Viền trắng quanh avatar theo biến */
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); /* Đổ bóng nhẹ cho avatar */
    display: block; /* Loại bỏ khoảng trắng thừa dưới ảnh */
    width: 100%; /* Đảm bảo ảnh lấp đầy khung */
    height: 100%; /* Đảm bảo ảnh vừa vặn và không bị méo */
    object-fit: cover; /* Đảm bảo ảnh vừa vặn và không bị méo */
}

.modern-author-box .author-info {
    flex-grow: 1; /* Cho phép thông tin tác giả chiếm phần còn lại */
}

.modern-author-box .author-name {
    margin-top: 0;
    margin-bottom: 8px;
    font-size: 24px;
    font-weight: 700;
    color: var(--primary-color); /* Màu tiêu đề theo biến */
}

.modern-author-box .author-name a {
    color: var(--primary-color); /* Màu liên kết tiêu đề theo biến */
    text-decoration: none;
    transition: color 0.3s ease;
}

.modern-author-box .author-name a:hover {
    color: var(--accent-color); /* Màu nhấn khi hover theo biến accent */
}

.modern-author-box .author-bio {
    font-size: 16px;
    line-height: 1.6;
    color: var(--text-color); /* Màu tiểu sử theo biến */
    margin-bottom: 15px;
}

.modern-author-box .author-meta-social {
    display: flex;
    flex-wrap: wrap; /* Cho phép xuống dòng nếu màn hình nhỏ */
    align-items: center;
    gap: 15px; /* Khoảng cách giữa các phần tử */
}

.modern-author-box .author-post-count {
    font-size: 15px;
    color: var(--text-color); /* Màu chữ theo biến */
    white-space: nowrap; /* Ngăn không cho xuống dòng */
}

.modern-author-box .author-post-count a {
    color: var(--accent-color); /* Màu liên kết theo biến accent */
    text-decoration: none;
    font-weight: 600;
    transition: color 0.3s ease;
}
.modern-author-box .author-post-count a:hover {
    color: var(--primary-color); /* Màu nhấn đậm hơn khi hover */
    text-decoration: underline;
}


.modern-author-box .author-social-links {
    display: flex; /* Đảm bảo các icon nằm ngang */
    gap: 10px; /* Khoảng cách giữa các icon mạng xã hội */
}

.modern-author-box .author-social-links a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background-color: var(--dark-divider-color); /* Nền icon theo màu divider */
    color: var(--primary-color); /* Màu icon theo màu chính */
    font-size: 18px;
    text-decoration: none;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.modern-author-box .author-social-links a:hover {
    background-color: var(--accent-color); /* Màu nền khi hover theo accent */
    color: var(--white-color); /* Màu icon trắng khi hover */
}

/* Responsive adjustments */
@media (max-width: 767.98px) {
    .modern-author-box {
        flex-direction: column; /* Xếp chồng avatar và info trên mobile */
        text-align: center;
    }
    .modern-author-box .author-avatar {
        margin-right: 0;
        margin-bottom: 20px; /* Khoảng cách dưới avatar */
        width: 100px; /* Kích thước avatar nhỏ hơn trên mobile */
        height: 100px;
    }
    .modern-author-box .author-avatar img {
        width: 100%;
        height: 100%;
    }
    .modern-author-box .author-meta-social {
        flex-direction: column; /* Xếp chồng các phần tử meta/social trên mobile */
        gap: 10px;
    }
    .modern-author-box .author-social-links {
        justify-content: center; /* Căn giữa các icon social */
    }
}

/* Tùy chỉnh CSS cho video slider */
/* Container để giữ tỉ lệ khung hình cho iframe */
.swiper-slide-video .video-container {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%; /* Tỉ lệ khung hình 16:9 (9 / 16 * 100) */
    height: 0;
    overflow: hidden;
}

/* Đảm bảo iframe lấp đầy container cha */
.swiper-slide-video .video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
}