/* Quantity stepper, shared by the product buy box and the cart. Source: "PDP" in app/globals.css. */

.stepper { display: flex; align-items: center; border: 1.5px solid var(--ink); border-radius: 999px; overflow: hidden; height: 48px; }
.stepper button { cursor: pointer; width: 42px; height: 100%; display: flex; align-items: center; justify-content: center; font-size: 20px; font-weight: 600; background: none; border: 0; color: var(--ink); }
.stepper button:hover { background: var(--tan); }
.stepper .q { width: 46px; text-align: center; font-size: 16px; font-weight: 700; }
.stepper.sm { border: 1px solid var(--line2); height: 36px; }
.stepper.sm button { width: 34px; font-size: 17px; font-weight: 400; }
.stepper.sm .q { width: 34px; font-size: 14px; }