.elementor-2269 .elementor-element.elementor-element-0c65b37{--display:flex;--align-items:stretch;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2269 .elementor-element.elementor-element-a1e0f34{margin:50px 0px calc(var(--kit-widget-spacing, 0px) + 50px) 0px;}.elementor-2269 .elementor-element.elementor-element-8df5209{--grid-row-gap:35px;width:var( --container-widget-width, 65% );max-width:65%;--container-widget-width:65%;--container-widget-flex-grow:0;--grid-column-gap:30px;--load-more-message-color:#F7F7F7;--load-more-spinner-color:#00005C;}.elementor-2269 .elementor-element.elementor-element-8df5209 .elementor-button{background-color:#000113;fill:#FFFFFF;color:#FFFFFF;}.elementor-2269 .elementor-element.elementor-element-8df5209 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-2269 .elementor-element.elementor-element-8df5209.elementor-element{--align-self:center;}.elementor-2269 .elementor-element.elementor-element-8df5209 .elementor-posts-container .elementor-post__thumbnail{padding-bottom:calc( 0.66 * 100% );}.elementor-2269 .elementor-element.elementor-element-8df5209:after{content:"0.66";}.elementor-2269 .elementor-element.elementor-element-8df5209 .elementor-post__thumbnail__link{width:100%;}.elementor-2269 .elementor-element.elementor-element-8df5209 .elementor-post__meta-data span + span:before{content:"•";}.elementor-2269 .elementor-element.elementor-element-8df5209 .elementor-post__card{border-radius:15px;}.elementor-2269 .elementor-element.elementor-element-8df5209 .elementor-post__text{margin-top:20px;}.elementor-2269 .elementor-element.elementor-element-8df5209 .elementor-post__thumbnail img{filter:brightness( 100% ) contrast( 100% ) saturate( 100% ) blur( 0px ) hue-rotate( 0deg );}.elementor-2269 .elementor-element.elementor-element-8df5209 .elementor-post__badge{right:0;}.elementor-2269 .elementor-element.elementor-element-8df5209 .elementor-post__card .elementor-post__badge{background-color:#F8C500;margin:20px;}.elementor-2269 .elementor-element.elementor-element-8df5209 .elementor-post__title, .elementor-2269 .elementor-element.elementor-element-8df5209 .elementor-post__title a{color:#D60000;}.elementor-2269 .elementor-element.elementor-element-8df5209 .elementor-post__meta-data{color:#160E0E;}.elementor-2269 .elementor-element.elementor-element-8df5209 .elementor-post__excerpt p{color:#000000;}:root{--page-title-display:none;}@media(max-width:767px){.elementor-2269 .elementor-element.elementor-element-8df5209 > .elementor-widget-container{margin:0px 010px 0px 10px;padding:0px 0px 0px 0px;}.elementor-2269 .elementor-element.elementor-element-8df5209{--container-widget-width:100%;--container-widget-flex-grow:0;width:var( --container-widget-width, 100% );max-width:100%;}.elementor-2269 .elementor-element.elementor-element-8df5209 .elementor-posts-container .elementor-post__thumbnail{padding-bottom:calc( 1.1 * 100% );}.elementor-2269 .elementor-element.elementor-element-8df5209:after{content:"1.1";}.elementor-2269 .elementor-element.elementor-element-8df5209 .elementor-post__thumbnail__link{width:100%;}}/* Start custom CSS for html, class: .elementor-element-a1e0f34 *//* ========================================================
   CSS TÙY CHỈNH CHO YOUTUBE FEED TRONG ELEMENTOR
   PHONG CÁCH: THÀNH ĐẠT, CHUYÊN NGHIỆP & CAO CẤP (PREMIUM)
   ======================================================== */

/* Cấu hình vùng chứa chính - Nền tảng tinh gọn, không màu mè */
.sb_youtube {
    font-family: 'Inter', 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px 0; /* Xóa padding 2 bên để căn lề thẳng hàng với nội dung web */
    background-color: transparent; /* Nền trong suốt để hòa quyện vào website */
}

/* Tiêu đề section - Quyền lực, rõ ràng */
.sb_youtube .sb_youtube_header {
    text-align: center;
    font-size: 24px;
    font-weight: 700;
    color: #0f172a; /* Xanh than/Đen đậm sang trọng */
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 32px;
    padding-bottom: 16px;
    border-bottom: 1px solid #e2e8f0; /* Viền mỏng thanh lịch */
}

/* Lưới video (Grid Layout) */
.sb_youtube .sby_items_wrap {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 32px !important; /* Khoảng cách rộng rãi hơn cho cảm giác thoáng đãng */
    padding: 0 !important;
}

/* Từng item video - Viền mỏng, bo góc nhẹ, đổ bóng thanh lịch */
.sb_youtube .sby_item {
    width: 100% !important;
    max-width: none !important;
    float: none !important;
    background: #ffffff;
    border-radius: 6px; /* Bo góc sắc nét hơn */
    border: 1px solid #f1f5f9;
    overflow: hidden;
    box-shadow: 0 4px 20px -2px rgba(15, 23, 42, 0.05); /* Bóng đổ rất nhẹ và sang */
    transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), box-shadow 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    position: relative;
    margin-bottom: 0 !important;
}

.sb_youtube .sby_inner_item {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Hiệu ứng đưa chuột vào mượt mà, nâng khối video lên nhẹ nhàng */
.sb_youtube .sby_item:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 24px -4px rgba(15, 23, 42, 0.12);
}

/* Hình thu nhỏ video */
.sb_youtube .sby_video_thumbnail {
    display: block;
    width: 100% !important;
    aspect-ratio: 16 / 9 !important;
    height: auto !important; 
    position: relative;
    background-color: #0f172a;
    margin: 0 !important;
}

/* Lớp phủ khi đưa chuột vào (Hover Overlay) - Gradient tối trầm */
.sb_youtube .sby_thumbnail_hover {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to top, rgba(15, 23, 42, 0.9) 0%, rgba(15, 23, 42, 0.4) 60%, transparent 100%);
    opacity: 0;
    transition: opacity 0.4s ease;
    display: flex;
    align-items: flex-end;
    padding: 20px;
    pointer-events: none;
    z-index: 2;
}

.sb_youtube .sby_item:hover .sby_thumbnail_hover {
    opacity: 1;
}

/* Tiêu đề video - Font chữ tinh tế, dễ đọc */
.sb_youtube .sby_video_title {
    color: #ffffff;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: 0.3px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-shadow: none; /* Bỏ text-shadow để chữ phẳng và hiện đại hơn */
}

/* Ẩn nền nút play mặc định của Smash Balloon */
.sb_youtube .sby_play_btn_bg {
    display: none !important;
}

/* Nút Play phong cách doanh nhân: Hiệu ứng kính mờ (Glassmorphism) */
.sb_youtube .sby_play_btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 56px;
    height: 56px;
    background: rgba(15, 23, 42, 0.6) !important; /* Đen trong suốt */
    border: 1px solid rgba(255, 255, 255, 0.2) !important; /* Viền trắng siêu mỏng */
    border-radius: 50%;
    display: flex !important;
    justify-content: center;
    align-items: center;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    pointer-events: none;
    backdrop-filter: blur(4px); /* Làm mờ nền phía sau */
    z-index: 3;
    padding: 0 !important;
    margin: 0 !important;
}

/* Chuyển sang đỏ rực rỡ và phóng to khi Hover */
.sb_youtube .sby_item:hover .sby_play_btn {
    background: #dc2626 !important; /* Đỏ Youtube nhưng sang hơn */
    border-color: #dc2626 !important;
    transform: translate(-50%, -50%) scale(1.1);
    box-shadow: 0 4px 12px rgba(220, 38, 38, 0.4);
}

.sb_youtube .sby_play_btn svg {
    width: 20px !important;
    height: 20px !important;
    color: #fff !important;
    margin-left: 3px !important;
    margin-top: 0 !important;
    fill: currentColor;
}

/* Phần Footer chứa các nút */
.sb_youtube .sby_footer {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 16px;
    margin-top: 40px;
    flex-wrap: wrap;
}

/* Định dạng chung cho nút - Chuyển sang dạng hình chữ nhật, bo góc sắc nét */
.sb_youtube .sby_load_btn, 
.sb_youtube .sby_follow_btn a {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 12px 28px !important;
    border-radius: 4px !important; /* Bo góc nhẹ 4px phong cách corporate */
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.3s ease !important;
    border: 1px solid transparent !important;
    outline: none;
    line-height: 1 !important;
}

/* Nút Load More: Phong cách Outline thanh lịch */
.sb_youtube .sby_load_btn {
    background-color: transparent !important;
    color: #475569 !important; /* Xám đậm */
    border-color: #cbd5e1 !important; /* Viền xám nhạt */
}
.sb_youtube .sby_load_btn:hover {
    background-color: #f8fafc !important;
    color: #0f172a !important;
    border-color: #0f172a !important; /* Đổi viền đậm khi hover */
}

/* Nút Subscribe: Nhấn mạnh sự uy tín */
.sb_youtube .sby_follow_btn a {
    background-color: #b91c1c !important; /* Đỏ đô sâu lắng và uy quyền */
    color: #ffffff !important;
    box-shadow: 0 4px 10px rgba(185, 28, 28, 0.2);
}
.sb_youtube .sby_follow_btn a:hover {
    background-color: #991b1b !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 14px rgba(185, 28, 28, 0.3);
}

.sb_youtube .sby_follow_btn svg {
    width: 18px !important;
    height: 18px !important;
}

/* ========================================================
   TRẠNG THÁI HIỂN THỊ TRÊN THIẾT BỊ DI ĐỘNG (RESPONSIVE)
   ======================================================== */
@media (max-width: 900px) {
    .sb_youtube .sby_items_wrap {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 24px !important;
    }
}

@media (max-width: 550px) {
    .sb_youtube .sby_items_wrap {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }
    .sb_youtube .sby_footer {
        flex-direction: column;
        width: 100%;
        gap: 12px;
    }
    .sb_youtube .sby_load_btn, 
    .sb_youtube .sby_follow_btn,
    .sb_youtube .sby_follow_btn a {
        width: 100% !important;
        box-sizing: border-box !important;
    }
}/* End custom CSS */