body, html { 
    margin: 0; 
    padding: 0; 
    font-family: Arial, sans-serif; 
    background: #121212; 
    color: #fff; 
}

header { 
    background: #333; 
    color: #fff; 
    padding: 10px 0; 
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
}

header nav a { 
    color: #fff; 
    margin-right: 15px; 
    text-decoration: none; 
}

.products { 
    padding: 40px 20px; 
    display: grid; 
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); 
    gap: 20px; 
}

.product-card { 
    border: 1px solid #ccc; 
    padding: 10px; 
    text-align: center; 
    background: rgba(0,0,0,0.5); 
    color: #fff; 
}

.product-card button { 
    margin-top: 10px; 
    padding: 5px 10px; 
    cursor: pointer; 
    background: rgba(0,0,0,0.7); 
    color: #fff; 
    border: none; 
}

button { 
    padding: 5px 10px; 
    cursor: pointer; 
}

input[type=number] { 
    width: 60px; 
}

input[type=text], input[type=password] { 
    padding: 5px; 
    width: 50%; 
    margin-bottom: 10px; 
}

table { 
    width: 100%; 
    border-collapse: collapse; 
    margin-bottom: 20px; 
}

table, th, td { 
    border: 1px solid #ccc; 
}

th, td { 
    padding: 10px; 
    text-align: center; 
}