.auto-scroll-container {
            /* Kích thước cố định (Yêu cầu 2) */
            width: 100%;
            max-width: 400px;
            height: 300px;
            
            /* Chỉ hiện thanh cuộn khi nội dung quá kích thước (Yêu cầu 3) */
            overflow: auto; 
            
            border: 2px solid #3b82f6;
            background-color: white;
        }

        /* ---------------------------------------------------- */
        /* PHẦN 2: ẨN THANH CUỘN CHO MỤC ĐÍCH THẨM MỸ (Yêu cầu 1: "xóa thanh cuộn") */
        /* Mặc dù đã dùng overflow: auto, đôi khi người dùng muốn cuộn nhưng không thấy thanh cuộn */
        /* ---------------------------------------------------- */
        .hide-scrollbar-container {
            /* Kích thước cố định và cuộn tự động */
            width: 100%;
            max-width: 400px;
            height: 300px;
            overflow: auto;
            
            border: 2px solid #ef4444;
            background-color: #fef2f2;
        }

        /* Ẩn thanh cuộn cho trình duyệt Webkit (Chrome, Safari, Opera) */
        .hide-scrollbar-container::-webkit-scrollbar {
            display: none; /* Xóa thanh cuộn */
            width: 0;      /* Hoặc đặt width: 0 để hoàn toàn không chiếm không gian */
            height: 0;
        }

        /* Ẩn thanh cuộn cho trình duyệt Firefox */
        .hide-scrollbar-container {
            scrollbar-width: none; /* Xóa thanh cuộn */
            -ms-overflow-style: none;  /* Ẩn thanh cuộn cho IE và Edge */
        }