body { font-family: sans-serif; margin: 0; background-color: #f4f4f4; }
header { background: #333; color: #fff; padding: 1rem; text-align: center; }
input[type="text"] { width: 60%; padding: 8px; }
main {justify-content: center; padding: 1rem; }

/*ปรับ main ให้เป็น Flex container สำหรับ responsive */
#product-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 15px;
    padding: 1rem;
}

.product-card {
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 5px;
    margin: 10px;
    padding: 15px;
    width: 200px;
    text-align: center;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease; 
}

.product-card img { max-width: 100%; height: auto; }
.product-card h3 { font-size: 1.1em; }
.product-card p { color: #888; }
.product-card:hover { /*เพิ่มเอฟเฟกต์เวลา hover */
    transform: scale(1.05);
    box-shadow: 0 4px 8px rgba(0,0,0,0.15); 
}

/*Responsive สำหรับ Tablet */
@media (max-width: 768px) {
    .product-card { width: 45%; }
}

/*Responsive สำหรับ Mobile */
@media (max-width: 480px) {
    .product-card { width: 90%; }
}