/* style.css */

/*
  Đây là nơi bạn thêm CSS tùy chỉnh ngoài Tailwind
  Ví dụ: font chữ đặc biệt, hiệu ứng phức tạp, v.v.
*/

/* Custom Shadow (Hiệu ứng đổ bóng đặc biệt) */
.custom-shadow {
    box-shadow: 0 15px 30px -5px rgba(0, 0, 0, 0.2), 0 8px 16px -8px rgba(0, 0, 0, 0.1);
}

/* Hiệu ứng zoom nhẹ khi hover vào ảnh sản phẩm */
.product-image-hover:hover img {
    transform: scale(1.05);
    transition: transform 0.4s ease-in-out;
}

/* Đảm bảo ảnh Hero Placeholder được thay thế bằng ảnh thực tế */
.hero-section {
    min-height: 400px;
    background-size: cover;
    background-position: center;
}

/* Các tùy chỉnh font chữ nếu bạn muốn dùng font ngoài Google Fonts */
/* @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');
body {
    font-family: 'Roboto', sans-serif;
} */