/* geral */
#offcanvasCart {max-width: 500px; width: 100%;}
.cart-modal .resume-title {display: none;}

.cart-modal .offcanvas-header, .cart-modal .offcanvas-body, .cart-modal .offcanvas-footer {padding: 16px;}
.cart-modal .offcanvas-header {border-bottom: 1px solid #ddd; margin-bottom: 16px;}
.cart-modal .offcanvas-body {padding-top: 0;}
.cart-modal .offcanvas-footer {border-top: 1px solid #ddd;}
.cart-modal .offcanvas-title {font-weight: 400;}
/* geral */

/* scroll */
.cart-modal .offcanvas-body::-webkit-scrollbar {width: 4px;}
.cart-modal .offcanvas-body::-webkit-scrollbar-thumb {background-color: #999; border-radius: 4px;}
.cart-modal .offcanvas-body::-webkit-scrollbar-track {background-color: #f1f1f1;}
/* scroll */

/* produto */
.cart-modal .cart-modal-product {display: grid; grid-template-areas:
	"product-details  product-details product-remove"
	"product-details  product-details product-quantity"
	"product-details  product-details product-quantity";
gap: 12px; grid-template-columns: auto;}
.cart-modal .cart-modal-product:not(:last-child) {border-bottom: 1px solid #eee; margin-bottom: 16px; padding-bottom: 16px;}

/* detalhes */
.cart-modal .product-name {font-size: 13px; line-height: 20px;}
.cart-modal .option-info {font-size: 12px;}
.cart-modal .option-info span {font-weight: 600;}
.cart-modal .cart-product-total {font-size: 18px;}
/* detalhes */

.cart-modal .cart-product-image {grid-area: product-image;}
.cart-modal .cart-modal-details {grid-area: product-details; display: flex; gap: 8px;}
.cart-modal .cart-modal-info {flex: 1; display: flex; flex-direction: column; gap: 8px; line-height: normal;}
/* remove */
.cart-modal .cart-modal-remove {grid-area: product-remove; display: flex; justify-content: end;}
/* remove */

/* quantidade */
.cart-modal .cart-modal-quantity {grid-area: product-quantity; display: flex; justify-content: end; align-items: end;}
.cart-modal .bootstrap-touchspin {gap: 2px; border: 1px solid #eee; border-radius: 4px;}
.cart-modal .cart-modal-quantity input {height: auto; border: none; padding: 6px 0;}
.cart-modal .cart-modal-quantity button {padding: 0 12px; height: 100%;}
.cart-modal .cart-modal-quantity button:active {border: 1px solid #fff;}
/* quantidade */
/* produto */

/* cupom */
.cart-modal .btn-coupon {background: #ebebeb; padding: 0 20px;}
.cart-modal .btn-coupon:hover {background: #dadada;}
.cart-modal .btn-coupon:active {background: #d1d1d1; border-color: #d1d1d1 !important;}
.cart-modal .input-coupon {height: 46px;}
/* cupom */

/* total */
.cart-modal .cart-totals {display: flex; flex-direction: column; gap: 8px; margin-bottom: 8px;}
.cart-modal .cart-totals .item:last-child {font-weight: 600; font-size: 18px;}
/* total */

/* botões */
.cart-modal .btn-cart {display: flex; justify-content: center; align-items: center; width: 100%; gap: 4px; height: 48px; font-weight: 500;}
.cart-modal .btn-cart svg {width: 24px; height: 24px}
.cart-modal .btn-checkout svg {fill: #fff;}
.cart-modal .btn-view-cart {background: #ebebeb; color: #3b3b3b;}
.cart-modal .btn-view-cart:hover {background: #dadada;}
.cart-modal .btn-view-cart:active {background: #d1d1d1; border: 1px solid #d1d1d1 !important;}
/* botões */