.products {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
    margin-bottom: 50px;
    text-align: left;
}

.product { display: flex; flex-direction: column; }
.product .description { flex: 1; }
.product img { width: 100%; height: auto; display: block; margin-bottom: 10px; }
.product h2 { font-size: 120%; font-weight: 600; margin: 0 0 5px 0; }
.product .price { color: #f6f43b; margin-bottom: 5px; }
.product .description { font-size: 85%; color: #afafaf; line-height: 1.4em; }
.product .row { display: flex; gap: 10px; margin-bottom: 10px; }
.product select { flex: 1; }
.product input { width: 60px; }

.store select, .store input,
.product select, .product input,
.cart select, .cart input {
    background: #2a2929;
    color: #eee;
    border: 1px solid #5d5d5d;
    padding: 5px;
}

.product button, .cart button.checkout {
    width: 100%;
    background: #5d5d5d;
    color: #fff;
    border: 0;
    padding: 10px;
    cursor: pointer;
}
.product button:hover, .cart button.checkout:hover { background: #777; }
.product button.added { background: #f6f43b; color: #111; }

.cart { text-align: left; margin-bottom: 30px; border-top: 1px solid #5d5d5d; padding-top: 20px; }
.cart h2 { font-size: 150%; font-weight: normal; }
.cart ul { list-style: none; padding: 0; }
.cart li { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid #333; }
.cart li .name { flex: 1; }
.cart li input { width: 55px; }
.cart li button.remove { background: none; border: 0; color: #afafaf; cursor: pointer; font-size: 120%; }
.cart label { display: block; margin-top: 15px; }
.cart select { width: 100%; }
.cart table.totals { width: 100%; margin: 15px 0; }
.cart table.totals td:last-child { text-align: right; }
.cart table.totals tr.total { font-weight: 700; color: #f6f43b; }
.cart .note { font-size: 85%; color: #afafaf; }
.cart button.checkout:disabled { opacity: 0.5; cursor: wait; }
.cart .error { color: #ff8a80; }

.cart-link { display: inline-block; margin-bottom: 30px; }

@media screen and (max-width: 639px) {
    .products { grid-template-columns: 1fr; }
}