section {
    margin: 40px 80px;
}

p {
    color: red;
    padding-left: 10px;
    border-left: 10px solid red;
    font-weight: bold;
}

.info-products .heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    margin: 20px 0;
}

.info-products .heading .heading-product {
    display: flex;
    align-items: center;
    gap: 80px;
}

/*  Nút Back - Next  */
.info-products .heading .change i {
    font-size: 2.4rem;
}

.info-products .heading i:hover {
    cursor: pointer;
    color: blue;
}

/* Thông tin Sản phẩm */
.product {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 40px 10px;
}

/* Khung sản phẩm */
.wrapper-product {
    width: 300px;
    height: auto;
    overflow: hidden;
}

.product-info {
    position: relative;
}

/* Ảnh sản phẩm */
.product-info img {
    width: 300px;
    height: 200px;
    object-fit: contain;
    background: rgb(232, 232, 232);
}

/* Thông tin giảm giá */
.product-info > span {
    position: absolute;
    top: 10px;
    left: 10px;

    background: green;
    color: white;
    padding: 4px 10px;
    border-radius: 4px;
}

/* Nút xem và đánh giá */
.product-info > i:first-of-type {
    position: absolute;
    top: 10px;
    right: 10px;
}

.product-info > i:last-of-type {
    position: absolute;
    top: 40px;
    right: 10px;
}

.product-info > i:hover {
    cursor: pointer;
    color: orange;
}

.product-info > i:active {
    cursor: pointer;
    color: red;
}

/* Nút mua hàng, thêm vào giỏ hàng */
.product-info a {
    position: absolute;
    bottom: 0;

    width: 100%;
    display: none;
    background: black;
    color: white;
    padding: 10px;

    text-decoration: none;
    text-align: center;
}

.product-info:hover a {
    display: block;
}

/* Tiêu đề sản phẩm */
.wrapper-product > a {
    display: inline-block;
    padding: 4px 0;
    color: gray;
    text-decoration: none;
}

/* Giá bán */
.wrapper-product .price {
    display: flex;
    gap: 10px;
    margin: 10px 0;
}

.wrapper-product .price span:first-child {
    color: red;
    font-weight: bold;
}

/* Lượt đánh giá 3 sao */
.wrapper-product .start-3 i:nth-child(-n + 3) {
    color: yellow;
}

/* Lượt đánh giá 4 sao */
.wrapper-product .start-4 i:nth-child(-n + 4) {
    color: yellow;
}

/* Lượt đánh giá 4.5 sao */
.wrapper-product .start-4-5 i {
    color: yellow;
}

/* Lượt đánh giá 5 sao */
.wrapper-product .start-5 i {
    color: yellow;
}

.wrapper-product .evaluate i:hover {
    cursor: pointer;
    color: gray;
}

/* Chọn kiểu dáng sản phẩm */
.wrapper-product .change-style span {
    display: inline-block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: red;
}

.wrapper-product .red-red span:first-child {
    display: inline-block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: red;
    border: 4px solid black;
}

.wrapper-product .yellow-red span:first-child {
    display: inline-block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: yellow;
    border: 4px solid gray;
}

.wrapper-product .black-red span:first-child {
    display: inline-block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: gray;
    border: 4px solid black;
}

/* Nút xem tất cả sản phẩm */
button {
    display: block;
    margin: 40px auto;
    padding: 15px 30px;
    border-radius: 4px;
    background: red;
    color: white;
    cursor: pointer;
}
