/* Chrome, Safari, Edge, Opera */
input[type='number']::-webkit-outer-spin-button,
input[type='number']::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type='number'] {
    -moz-appearance: textfield;
}

.product-title {
    display: -webkit-box;
    -webkit-line-clamp: 2; /* giới hạn 2 dòng */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;

    line-height: 1.4rem; /* chiều cao mỗi dòng */
    height: calc(1.4rem * 2); /* bắt buộc đúng 2 dòng */
}

.product-card {
    transition-property: transform, opacity;
    transition-timing-function: ease-out;
    transition-duration: 700ms;
}

@keyframes ping-slow {
    0%,
    100% {
        transform: scale(2);
    }
    50% {
        transform: scale(2.5);
    }
}

.animate-ping-slow {
    animation: ping-slow 1s infinite;
}

@keyframes slideFromLeft {
    0% {
        transform: translateX(-80px);
        opacity: 0;
    }
    100% {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes slideFromRight {
    0% {
        transform: translateX(80px);
        opacity: 0;
    }
    100% {
        transform: translateX(0);
        opacity: 1;
    }
}

.animate-slide-left {
    animation: slideFromLeft 1s ease-out forwards;
}

.animate-slide-right {
    animation: slideFromRight 1s ease-out forwards;
}

@keyframes fadeUp {
    0% {
        opacity: 0;
        transform: translateY(40px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.fade-up {
    animation: fadeUp 0.8s ease-out forwards;
}

.clamp-1 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-all;
}

.prose h1 {
    font-size: 2.5rem; /* h1 */
    font-weight: 700;
    line-height: 1.2;
    margin-top: 1rem;
    margin-bottom: 1rem;
}

.prose h2 {
    font-size: 2rem; /* h2 */
    font-weight: 700;
    line-height: 1.25;
    margin-top: 0.9rem;
    margin-bottom: 0.9rem;
}

.prose h3 {
    font-size: 1.75rem; /* h3 */
    font-weight: 700;
    line-height: 1.3;
    margin-top: 0.8rem;
    margin-bottom: 0.8rem;
}

.prose h4 {
    font-size: 1.5rem; /* h4 */
    font-weight: 600;
    line-height: 1.35;
    margin-top: 0.7rem;
    margin-bottom: 0.7rem;
}

.prose h5 {
    font-size: 1.25rem; /* h5 */
    font-weight: 600;
    line-height: 1.4;
    margin-top: 0.6rem;
    margin-bottom: 0.6rem;
}

.prose h6 {
    font-size: 1rem; /* h6 */
    font-weight: 600;
    line-height: 1.4;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}

@keyframes pulse-ring {
    0% {
        box-shadow: 0 0 0 0 rgba(227, 150, 50, 0.4);
        transform: scale(1);
    }
    50% {
        box-shadow: 0 0 0 10px rgba(227, 150, 50, 0.4);
        transform: scale(1.08);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(227, 150, 50, 0.4);
        transform: scale(1);
    }
}

.animate-pulse-ring {
    animation: pulse-ring 1s infinite;
}