﻿.side-pic.p-side-item.list-img-homee .p-side-titleas {
    width: unset;
}

.p-side-titleas {
}

.side-pic.p-side-item .p-side-titleas {
}

.p-side-titleas {
    width: 100%;
    display: flex;
    align-items: center;
    position: relative;
    padding-left: 16px;
}

    .p-side-titleas h3 {
        font-family: 'OpSan-Bold';
        color: var(--default-color-2);
        margin: 10px 0px 10px 6px;
        text-transform: uppercase;
        position: relative;
    }

        .p-side-titleas h3:before {
            top: -11px;
            position: absolute;
            content: "";
            width: 45px;
            height: 45px;
            border-radius: 50%;
            left: -17px;
            border: 1px solid var(--default-color-2);
            clip-path: circle(81.4% at 0 32%);
        }
.link-view-school-activity-newss {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    color: #2B469C;
    font-weight: 500;
    transition: all 0.3s ease;
}

.link-view-school-activity-newss .icon {
    display: flex;
    align-items: center;
    transition: transform 0.3s ease;
}

.link-view-school-activity-newss svg path {
    transition: fill 0.3s ease;
}

/* Hover */
.link-view-school-activity-newss:hover {
    color: #CF0802;
}

.link-view-school-activity-newss:hover .icon {
    transform: translateX(5px);
}

.link-view-school-activity-newss:hover svg path {
    fill: #CF0802;
}
.mbzas {
    position: relative;
    display: inline-block;
    color: #2B469C;
    text-decoration: none;
    font-weight: 500;
    transition: all 0.3s ease;
}

/* Hover text */
.mbzas:hover {
    color: #CF0802;
    transform: translateX(3px);
}

/* Underline animation */
.mbzas::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 0;
    height: 2px;
    background: #CF0802;
    transition: width 0.3s ease;
}

.mbzas:hover::after {
    width: 100%;
}
.link-view-school-activity-newss {
    font-size: 17px;
    display: flex;
    height: 32px;
    align-items: center;
    color: var(--default-color-2);
    font-weight: bold;
    flex-direction: row-reverse;
    gap: 8px;
}

a.link-view-school-activity-newss .icon {
}

.top-az {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 18px;
    /* padding-top: 18px; */
}

.bottom-az {
    width: 100%;
}

.item-bottom-az {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
}

.new-az-item {
}

    .new-az-item .az-item-top {
        height: 180px;
        max-height: 100%;
    }

        .new-az-item .az-item-top img {
        }

    .new-az-item .az-item-bottom {
    }

.item-bottom-az .new-az-item:nth-child(1) .az-descript,
.item-bottom-az .new-az-item:nth-child(2) .az-descript,
.item-bottom-az .new-az-item:nth-child(3) .az-descript {
    display: none;
}

.new-az-item .az-item-bottom .az-title {
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    color: var(--default-color-2);
    font-family: 'InterSM';
    font-size: 13px;
    padding: 9px 0px;
    padding-bottom: 3px;
}

.new-az-item .az-item-bottom .az-descript {
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    font-size: 15px;
    font-family: 'InterM';
    color: #4D4D4D;
}
/* Phóng to nhẹ hình ảnh khi hover */
.new-az-item .az-item-top {
    overflow: hidden; /* Để ảnh không tràn ra ngoài khi phóng to */
    border-radius: 11px;
}

    .new-az-item .az-item-top img {
        transition: transform 0.5s ease; /* Tạo độ mượt */
        object-position: top;
    }

.new-az-item:hover .az-item-top img {
    transform: scale(1.1); /* Phóng to 10% */
}

/* Đổi màu tiêu đề và hiệu ứng chữ */
.new-az-item:hover .az-title {
    color: var(--default-color-1) !important; /* Đổi sang màu nhấn của bạn */
    /* text-decoration: underline; */ /* Gạch chân tiêu đề nếu muốn */
}

/* Tạo hiệu ứng bóng đổ nhẹ cho toàn bộ item khi hover */
.new-az-item {
    transition: all 0.3s ease;
    cursor: pointer;
    padding: 5px; /* Tạo khoảng thở để đổ bóng không bị cắt */
}

    .new-az-item:hover {
        /* background: #fff; */
        /* box-shadow: 0 10px 20px rgba(0,0,0,0.1); */
        transform: translateY(-3px); /* Nhấc nhẹ item lên */
    }

.item-bottom-az .new-az-item:nth-child(1) .az-item-top img {
    height;
    height: 422px;
}

.item-bottom-az .new-az-item:nth-child(1) .az-item-top {
    height: 100%;
}

.item-bottom-az .new-az-item:nth-child(1) {
    grid-row: span 2 / span 2;
    grid-column: span 2 / span 2;
}

.item-bottom-az .new-az-item:nth-child(2) {
    grid-column-start: 3;
}

.item-bottom-az .new-az-item:nth-child(3) {
    grid-column-start: 3;
    grid-row-start: 2;
}

.item-bottom-az .new-az-item:nth-child(4) {
    grid-row-start: 3;
}

.item-bottom-az .new-az-item:nth-child(5) {
    grid-row-start: 3;
}

.item-bottom-az .new-az-item:nth-child(6) {
    grid-row-start: 3;
}

.mid-ad-item .imgs-za img {
    border-radius: 12px;
}

.mid-ad-list {
    display: grid;
    grid-auto-rows: minmax(min-content, max-content);
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 10px;
    row-gap: 10px;
}

.name-midz h2 {
    margin: 7px 0px;
    text-transform: uppercase;
    font-size: 18px;
}
.mbzas{
    color: #D83631;
    font-family: 'InterR';
    font-size: 15px;
    font-style: italic;
    font-weight: 500;
    padding-top: 10px;
    line-height: 150%;
}
.tt-midz {
    padding-top: 10px;
    margin-top: 10px;
    position: relative;
    color: #4D4D4D;
    font-size: 15px;
    text-align: justify;
    width: 97%;
}

    .tt-midz:before {
        position: absolute;
        content: "";
        width: 39px;
        height: 1px;
        background: red;
        top: 0
    }

.name-midz span {
    font-style: italic;
    font-size: 17px;
    color: #676767;
    font-family: 'InterR';
    padding-bottom: 10px;
}

.ad-zx span {
    text-transform: uppercase;
    font-family: 'InterR';
    font-size: 14px;
    position: relative;
    padding-left: 16px;
}

    .ad-zx span:before {
        position: absolute;
        content: '';
        width: 10px;
        height: 10px;
        background: red;
        left: 0;
        top: 25%;
        border-radius: 17px;
    }

.asdz {
    margin-top: 0px !important;
}

.mid-av img {
    width: 100%;
}

.zsa {
    padding-bottom: 40px;
}

.mid-av {
    padding: 10px 0
}

.item-bottom-av-t {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    flex-direction: column;
    width: 79%;
}

.imghd-t {
    width: 100%;
}

    .imghd-t img {
    }

.btaz {
}

    .btaz .WDateViewNewHome {
        font-size: 10px;
        display: block;
    }

        .btaz .WDateViewNewHome a {
            display: flex;
        }

        .btaz .WDateViewNewHome svg {
            height: 11px
        }

    .btaz h2 {
        font-size: 16px;
        font-family: 'InterM';
        color: #4C4C4C;
        font-weight: 700;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        display: -webkit-box;
    }

    .btaz .vbtazza {
        color: #4D4D4D;
        font-family: 'InterM';
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%; /* 13.775px */
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        display: -webkit-box;
        margin-top: 10px;
    }

.bottom-av {
    display: flex;
    gap: 17px;
}

.item-bottom-av-b {
    display: grid;
    grid-auto-rows: minmax(min-content,max-content);
    grid-template-columns: repeat(1,minmax(0,1fr));
    column-gap: 16px;
    row-gap: 26px;
}

.items-hdbt {
}

.items-hdbt-top {
    width: 100%;
}

    .items-hdbt-top img {
    }

    .items-hdbt-top .items-hdbt-bottom {
    }

        .items-hdbt-top .items-hdbt-bottom h2 {
        }

.items-hdbt-bottom {
}

    .items-hdbt-bottom h2 {
        FONT-SIZE: 14px;
        font-family: 'InterSM';
        color: #4C4C4C;
        padding-top: 9px;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        display: -webkit-box;
    }
/* Hiệu ứng cho khối lớn phía trên */
.item-bottom-av-t {
    transition: all 0.3s ease;
    cursor: pointer;
}

.imghd-t {
    overflow: hidden; /* Cần thiết để ảnh không tràn khi zoom */
    border-radius: 4px;
}

    .imghd-t a {
    }

        .imghd-t a img {
            height: 300px;
        }

    .imghd-t img {
        transition: transform 0.6s ease;
        display: block;
    }

/* Khi di chuột vào cả vùng item-bottom-av-t */
.item-bottom-av-t:hover .imghd-t img {
    transform: scale(1.08); /* Phóng to ảnh 8% */
}

.item-bottom-av-t:hover h2 {
    color: var(--default-color-1) !important; /* Đổi màu tiêu đề sang màu chủ đạo */
    transition: color 0.3s ease;
}
/* 1. Thiết lập chung để hiệu ứng mượt mà */
.items-hdbt {
    cursor: pointer;
    transition: all 0.3s ease;
}

    .items-hdbt a {
        display: flex;
        gap: 18px;
    }
/* 2. Hiệu ứng cho phần ảnh (items-hdbt-top) */
.items-hdbt-top {
    /* overflow: hidden; */ /* Quan trọng: để ảnh không tràn ra ngoài khi phóng to */
    border-radius: 4px; /* Bo góc nhẹ cho hiện đại */
    height: 99px;
    width: 209px;
}

.bomttt-az-saa {
}

.item-bottm-tkba {
}

    .item-bottm-tkba .img-tkba img {
    }

item-bottm-tkba .descript-tkba {
}

    item-bottm-tkba .descript-tkba span {
    }

.item-top-az {
    width: 100%;
}

.item-bottom-az {
}

    .item-bottom-az > *:first-child .az-title {
        font-size: 16px;
        width: 89%;
    }

    .item-bottom-az > *:first-child .az-descript {
        font-size: 14px
    }

.bomttt-az-saa {
}
/* 1. Thiết lập khung chứa ảnh */
.img-tkba {
    position: relative;
    overflow: hidden; /* Cắt phần ảnh thừa khi phóng to */
    border-radius: 8px; /* Bo góc ảnh cho mềm mại */
}

    .img-tkba img {
        width: 100%;
        display: block;
        transition: transform 0.5s ease; /* Tạo hiệu ứng chuyển động mượt */
    }

/* 2. Hiệu ứng phóng to ảnh khi hover vào thẻ <a> */
.imz-az:hover .img-tkba img {
    transform: scale(1.1); /* Phóng to 10% */
}

/* 3. Hiệu ứng cho phần chữ mô tả */
.descript-tkba {
    padding: 12px 5px;
    text-align: center;
    transition: all 0.3s ease;
}

    .descript-tkba span {
        font-family: 'InterM', sans-serif;
        font-size: 14px;
        color: #333;
        font-weight: 600;
        transition: color 0.3s ease;
    }

/* 4. Đổi màu chữ và thêm bóng đổ nhẹ khi hover */
.imz-az:hover .descript-tkba span {
    color: var(--default-color-4); /* Đổi sang màu đỏ hoặc màu chủ đạo của bạn */
}

.item-bottm-tkba {
    transition: transform 0.3s ease;
}

.imz-az:hover .item-bottm-tkba {
    transform: translateY(-5px); /* Nhấc nhẹ cả khối lên trên */
}

.item-bottom-as {
    width: 100%;
}

.descript-tkba {
    color: #4C4C4C;
    font-family: 'InterSM';
    font-size: 16.037px;
    font-style: normal;
    font-weight: 700;
    line-height: 150%; /* 24.055px */
    padding-top: 10px;
}

.bomttt-az-sa .item-tracuu:nth-child(1) img {
    border-radius: 10px;
}

.bomttt-az-sa {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(3, 1fr);
    gap: 12px;
}

    .bomttt-az-sa .item-tracuu:nth-child(1) {
        grid-column: span 2 / span 2;
        grid-row: span 3 / span 3;
    }

    .bomttt-az-sa .item-tracuu:nth-child(2) {
        grid-column-start: 3;
    }

    .bomttt-az-sa .item-tracuu:nth-child(3) {
        grid-column-start: 3;
        grid-row-start: 2;
    }

    .bomttt-az-sa .item-tracuu:nth-child(4) {
        grid-column-start: 3;
        grid-row-start: 3;
    }

    .bomttt-az-sa .item-tracuu:nth-child(2),
    .bomttt-az-sa .item-tracuu:nth-child(3),
    .bomttt-az-sa .item-tracuu:nth-child(4) {
        display: flex;
        gap: 10px;
    }

        .bomttt-az-sa .item-tracuu:nth-child(2) .item-tracuu-top img, .bomttt-az-sa .item-tracuu:nth-child(3) .item-tracuu-top img,
        .bomttt-az-sa .item-tracuu:nth-child(4) .item-tracuu-top img {
            width: 114px;
            height: 101px;
            border-radius: 10px;
        }

    .bomttt-az-sa .item-tracuu:nth-child(1) .item-tracuu-bottom span {
        overflow: hidden;
        /* text-overflow: ellipsis;
    /* -webkit-line-clamp: 3; */
        -webkit-box-orient: vertical;
        display: -webkit-box;
        /* margin-top: 10px;
    
}
.bomttt-az-sa .item-tracuu:nth-child(1) .item-tracuu-bottom{padding-top: 12px;/* overflow: hidden; */
        text-overflow: ellipsis;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        display: -webkit-box;
        margin-top: 10px;
    }

.item-tracuu-bottom span {
    color: #4C4C4C;
    font-family: 'InterSM';
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 150%; /* 24px */
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    /* margin-top: 10px; */
}
/* 1. Thiết lập khung chứa để không bị tràn ảnh khi phóng to */
.img-tkb {
    overflow: hidden;
    border-radius: 5px; /* Tùy chọn: Bo góc nhẹ cho đẹp */
}

    .img-tkb img {
        transition: transform 0.4s ease; /* Hiệu ứng mượt cho ảnh */
        display: block;
        width: 100%;
    }

/* 2. Hiệu ứng khi hover vào thẻ <a> hoặc item */
.imz-az:hover .img-tkb img {
    transform: scale(1.1); /* Phóng to ảnh 10% */
}

/* 3. Hiệu ứng cho phần mô tả (chữ) */
.descript-tkb {
    transition: all 0.3s ease;
    /* text-align: center; */
    padding: 10px 0;
}

    .descript-tkb span {
        transition: color 0.3s ease;
        font-family: 'InterM', sans-serif; /* Sử dụng font bạn đang dùng */
        font-weight: bold;
    }

/* Thay đổi màu chữ khi hover */
.imz-az:hover .descript-tkb span {
    color: var(--default-color-5); /* Đổi sang màu đỏ/xanh chủ đạo của bạn */
}

/* 4. Hiệu ứng đổ bóng nhẹ cho toàn khối (Tùy chọn) */
.item-bottm-tkb {
    transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.imz-az:hover .item-bottm-tkb {
    /* box-shadow: 0 4px 15px rgba(0,0,0,0.1); */
    transform: translateY(-2px); /* Nhích nhẹ lên trên */
}

.bottom-az.zsa {
    display: flex;
    gap: 16px;
    padding-bottom: 0;
}

.img-tkb {
    width: 100%;
}

.imz-az {
}

.item-bottm-tkb {
    /* display: flex; */
    gap: 9px;
    position: relative;
}

.img-tkb img {
    width: 100%;
}

.descript-tkb {
    color: #4C4C4C;
    font-family: 'INTERSM';
    font-size: 13px;
    font-style: normal;
    font-weight: 700;
    line-height: 150%; /* 16.812px */
    position: absolute;
    bottom: 13px;
    left: 14px;
    text-transform: uppercase;
    color: #FFFF;
}

.items-hdbt-top img {
    transition: transform 0.5s ease; /* Thời gian phóng to ảnh */
    display: block;
    width: 186px;
    border-radius: 6px;
}

/* 3. Hiệu ứng Hover tổng thể */
.items-hdbt:hover .items-hdbt-top img {
    transform: scale(1.1); /* Phóng to ảnh 10% */
}

.items-hdbt:hover h2 {
    color: var(--default-color-1) !important; /* Đổi màu tiêu đề khi hover */
    transition: color 0.3s ease;
}

/* 4. Thêm hiệu ứng nhấc khung (Tùy chọn) */
.items-hdbt:hover {
    transform: translateY(-3px); /* Nhấc nhẹ item lên trên */
}

@media only screen and (max-width: 739px) {
    /* 1. Tổng thể container */
    .mid-side-home {
        width: 100% !important; /* Chiếm toàn bộ chiều rộng màn hình */
        /* padding: 0 10px; */
    }

    .mid-side-container {
        display: block; /* Chuyển về dòng đơn */
    }

    .zsa {
        display: none;
    }
    /* 2. Phần Tin nhà trường (Grid 3 cột -> 1 cột) */
    .item-bottom-az {
        grid-template-columns: repeat(1, 1fr) !important;
        gap: 15px;
    }

        /* Hủy bỏ các thiết lập grid-column đặc biệt trên mobile để hiện theo hàng dọc */
        .item-bottom-az .new-az-item:nth-child(1),
        .item-bottom-az .new-az-item:nth-child(2),
        .item-bottom-az .new-az-item:nth-child(3),
        .item-bottom-az .new-az-item:nth-child(4),
        .item-bottom-az .new-az-item:nth-child(5),
        .item-bottom-az .new-az-item:nth-child(6) {
            grid-column: span 1 / span 1 !important;
            grid-row: auto !important;
            grid-column: unset !important;
            grid-row: unset !important;
        }

    .new-az-item .az-item-top {
        height: 115px !important; /* Để ảnh tự co giãn */
    }

    /* 3. Phần Trang Tin Học Sinh (Flex ngang -> dọc) */
    .bottom-az.zsa {
        flex-direction: column;
        gap: 0px;
    }

    .mid-ad-list {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }

        .mid-ad-list .mid-ad-item:nth-child(2) {
            padding-bottom: 14px
        }

    .p-side-titleas h3 {
        font-size: 19px;
    }

    .item-top-az,
    .item-bottom-as {
        width: 100% !important; /* Khối trái và phải chiếm hết chiều rộng */
    }

    /* 4. Phần Thông tin hoạt động (Khối to phía trên) */
    .item-bottom-av-t {
        flex-direction: column; /* Ảnh trên chữ dưới */
        gap: 10px;
        width: 100%;
        padding-bottom: 21px;
    }

    .items-hdbt a .items-hdbt-top {
        width: 100%;
        height: 130px;
    }

    .btaz {
        width: 100% !important;
    }

    /* 5. Danh sách hoạt động phía dưới (4 cột -> 2 cột) */
    .item-bottom-av-b {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px;
    }

    .items-hdbt a {
        display: block
    }

    .items-hdbt-top img {
        width: 100%;
    }
    /* 6. Điều chỉnh Header và tiêu đề */
    .side-pic.p-side-item.list-img-homee .p-side-titleas {
        /* Mở rộng tiêu đề trên mobile */
        border-top-right-radius: 12px;
        border-bottom-right-radius: 12px;
    }

    .top-az {
        gap: 10px;
        align-items: center;
        padding-top: 15px;
        padding-bottom: 30px;
        margin-top: 15px;
        border-top: 1px dashed var(--default-color-2);
    }

    .link-view-school-activity-newss {
        border-radius: 7px;
        position: static; /* Không để lệch sang phải trên mobile */
        font-size: 14px;
        height: 26px;
    }

    .new-az-item {
        padding: 0;
        padding-bottom: 10px;
    }

    .img-tkb {
        width: 100%;
    }

    .new-az-item .az-item-bottom .az-title {
        -webkit-line-clamp: 2;
    }

    .item-bottom-az .new-az-item:nth-child(1) .az-descript, .item-bottom-az .new-az-item:nth-child(2) .az-descript, .item-bottom-az .new-az-item:nth-child(3) .az-descript {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        display: -webkit-box;
    }

    .item-bottm-tkb {
        flex-direction: column
    }

    .descript-tkb {
        padding: 2px;
    }

    .bomttt-az-sa {
        display: grid;
        grid-auto-rows: minmax(min-content,max-content);
        grid-template-columns: repeat(1,minmax(0,1fr));
        column-gap: 5px;
        gap: 6px;
        grid-template-rows: unset;
    }
}

@media (max-width:739px) {

    .bomttt-az-sa .item-tracuu:nth-child(3) {
        grid-column-start: unset;
        grid-row-start: unset;
    }

    .bomttt-az-sa .item-tracuu:nth-child(4) {
        grid-column-start: unset;
        grid-row-start: unset;
    }

    .bottom-av {
        display: block;
    }

    .bomttt-az-sa .item-tracuu:nth-child(1) .item-tracuu-bottom span {
        TEXT-ALIGN: center;
        font-size: 16px;
        padding-bottom: 20px;
    }

    .home {
        display: block !important;
        /* padding-top: 15px !important; */
    }

    .wp-notification-banner, .right-side-home {
        width: 100% !important;
    }

    .left-notification {
    }

    .item-bottom-az {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px;
    }

    .side-note.p-side-item.list-side-new-event.side-list-link-hh {
        display: none;
    }

    .p-side-title h3 {
        font-size: 16px !important;
    }

    .full-note-new-home {
        margin-top: 10px;
    }

    .sadvz {
        margin-top: 0;
    }

    .p-side-wrap.side-list-new-event-homead {
        height: unset;
    }

    .ttxvisit {
        font-size: 13px;
    }

    .vpo p {
        font-size: 13px;
    }

    .vcas strong {
        font-size: 12px;
    }

    .item-bottom-az .new-az-item:nth-child(1) .az-item-top img {
        height: 100%;
    }

    .item-bottom-az > *:first-child .az-title {
        font-size: 13px;
    }

    .item-bottom-az > *:first-child .az-descript {
        font-size: 12px;
    }

    a.link-view-school-activity-newss .icon {
        w;
        /* height: 26px; */
        /* width: 22px; */
        position: relative;
        top: 3px;
    }

    .bomttt-az-sa .item-tracuu:nth-child(1) {
        grid-row: unset;
        grid-column: unset;
    }

    .bomttt-az-sa .item-tracuu:nth-child(2) {
        grid-column-start: unset;
        .bomttt-az-sa .item-tracuu:nth-child(3)

{
}

.bomttt-az-sa {
    grid-template-columns: unset;
}

.descript-tkb {
    font-sizE: 12PX;
}
/* 1. Thiết lập lại Grid cho container chính */
.item-bottom-az {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important; /* Luôn chia 2 cột đều */
    gap: 8px !important;
}

    /* 2. Hai tin đầu tiên: Nổi bật (Mỗi tin chiếm full 1 hàng - 2 cột) */
    .item-bottom-az .new-az-item:nth-child(1),
    .item-bottom-az .new-az-item:nth-child(2) {
        grid-column: span 2 / span 2 !important;
        grid-row: auto !important;
    }

        /* Đảm bảo ảnh của 2 tin đầu tiên đủ cao để nổi bật */
        .item-bottom-az .new-az-item:nth-child(1) .az-item-top,
        .item-bottom-az .new-az-item:nth-child(2) .az-item-top {
            height: 254px !important; /* Bạn có thể tăng lên 200px nếu muốn to hơn */
        }

    /* 3. Các tin còn lại (từ tin số 3 trở đi): Tự động xếp 2 tin mỗi hàng */
    .item-bottom-az .new-az-item:nth-child(n+3) {
        grid-column: span 1 / span 1 !important;
        grid-row: auto !important;
    }

    /* 4. Reset các thiết lập vị trí cũ trong file CSS của bạn để không bị lệch */
    .item-bottom-az .new-az-item:nth-child(3),
    .item-bottom-az .new-az-item:nth-child(4),
    .item-bottom-az .new-az-item:nth-child(5),
    .item-bottom-az .new-az-item:nth-child(6) {
        grid-column-start: unset !important;
        grid-row-start: unset !important;
    }

/* 5. Điều chỉnh lại kích thước chữ và ảnh cho khớp mobile */
.new-az-item .az-item-top {
    height: 110px !important; /* Chiều cao cho các tin nhỏ phía dưới */
}

    .new-az-item .az-item-top img {
        height: 100% !important;
        width: 100% !important;
        object-fit: cover !important;
    }

.az-title {
    font-size: 13px !important;
    line-height: 1.3 !important;
    -webkit-line-clamp: 2 !important; /* Giới hạn 2 dòng cho gọn */
}

.az-descript {
    font-size: 12px !important;
    -webkit-line-clamp: 2 !important;
    display: -webkit-box !important;
}

/* Căn chỉnh lại Header và icon xem thêm cho cân đối */
.top-az {
    padding-bottom: 10px !important;
    padding-top: 15px;
    margin-top: 15px;
    border-top: 1px dashed var(--default-color-2);
}

.link-view-school-activity-newss {
    font-size: 15px !important;
    height: 0px !important;
}

a.link-view-school-activity-newss .icon {
    height: unset !important;
    width: unset !important;
}

.mid-ad-list {
    grid-template-columns: repeat(1, minmax(0, 1fr));
}

    .mid-ad-list .mid-ad-item:nth-child(2) {
        padding-bottom: 14px
    }

.bomttt-az-sa .item-tracuu:nth-child(3) {
}
}
