@media (min-width: 1281px) {
    .auth-links {
        display: none;
    }
}

@media (max-width: 1280px) {
    .product-container {
        margin-top: 50px;

        .auth-links {
            display: flex;
            flex-direction: column;

            p {
                display: none;
                margin-bottom: 5px;
                font-size: 20px;
                font-weight: 900;
                background-color: rgba(56, 56, 56, 0.8);
                color: #fff;
                padding: 2px 8px;
                width: fit-content;
                border-radius: 10px;
            }

            div {
                display: flex;

                li a {
                    margin-right: 10px;
                    background-color: #b96262;
                    text-transform: uppercase;
                    padding: 5px 10px;
                    border-radius: 10px;
                    color: #fff;
                }

                #comment-login,
                #comment-register {
                    display: none;
                }

                .isLogin,
                .isRegister {
                    display: block !important;
                }

                .login-highlight {
                    animation: blink-l 0.5s ease infinite;

                    @keyframes blink-l {
                        0% {}

                        100% {
                            background-color: rgb(0, 110, 255);
                            border-radius: 10px;
                        }
                    }
                }

                .register-highlight {
                    animation: blink-r 0.5s ease infinite;

                    @keyframes blink-r {
                        0% {}

                        100% {
                            background-color: yellow;
                            border-radius: 10px;
                        }
                    }
                }
            }
        }
    }
}

@media (min-width: 545px) and (max-width: 1024px) {
    .product-container .add-comment .showForm {
        width: 70vw;
    }

    .product-container .product-comments .showCommentForm {
        width: 90vw;
    }

}

@media (min-width: 769px) and (max-width: 1280px) {
    .product-info {
        justify-content: space-around;
        flex-direction: column;
        img {
            height: 50vh !important;
        }
        .info {
            width: 95vw !important;
        }
    }
}

@media (max-width: 768px) {
    .product-info {
        justify-content: unset;
        flex-direction: column;

        img {
            height: auto !important;
        }

        .info {
            width: 95vw !important;
        }
    }
}

@media (min-width: 320px) and (max-width: 544px) {
    .product-container .add-comment .showForm {
        width: 80vw;
    }

    .product-container .product-comments .showCommentForm {
        width: 85vw;
    }
}