.quantityControls { display: flex; align-items: center; background-color: #ffb70014; border-radius: 888px; width: fit-content; } .quantityLabel { font-size: 14px; color: var(--secondary-color); font-weight: 500; } .quantityInputContainer { display: flex; align-items: center; padding: 8px; border-radius: 888px; width: 90px; height: 32px; } .quantityButton { padding: 0px; width: 25px; height: 32px; display: flex; align-items: center; justify-content: center; color: var(--secondary-color); transition: all 0.2s ease; } .quantityInput { text-align: center; border: none; box-shadow: none; font-size: 16px; font-weight: 600; } .removeButton { padding: 4px 0px; height: 32px; display: flex; align-items: center; gap: 4px; width: 30px; } .deleteButtonContainer { position: absolute; top: 12px; right: 12px; background-color: #ffb70014; border-radius: 50%; padding: 8px; cursor: pointer; transition: all 0.3s ease; } .deleteIcon { font-size: 18px; color: var(--secondary-color); } .cartItemActions :global(.ant-input-number-outlined) { border: none; width: 40px; background-color: inherit; text-align: center; } .cartItemActions :global(.ant-input-number-input) { text-align: center !important; } .plusIcon { margin-bottom: 1px; } .deleteIcon { position: relative; right: 1px; }