@import url('/css/checkout-ui.css');
/* Keep the footer below the cart and at the viewport bottom on short pages. */
.checkout-page > .page-box > .page-box-content { display: flex; flex-direction: column; min-height: 100vh; }
.checkout-page > .page-box > .page-box-content > #main { flex: 1 0 auto; }
.checkout-page > .page-box > .page-box-content > #footer { flex-shrink: 0; margin-top: auto; }

.managed-basket { padding-bottom: 40px; }
.managed-basket .page-header { position: relative; margin-bottom: 56px; padding-bottom: 22px; }
.managed-basket .page-header:after { content: ''; position: absolute; bottom: -1px; left: 0; width: 40px; height: 1px; background: #333; }
.basket-count { font-size: 17px; font-weight: 700; margin-bottom: 24px; }
.basket-lines { border-top: 1px solid #eee; }
.basket-line { display: grid; grid-template-columns: 180px minmax(0,1fr) 130px 130px; align-items: start; gap: 24px; padding: 22px 16px; border-bottom: 1px solid #eee; }
.basket-image { width: 105px; height: 105px; object-fit: cover; }
.basket-description { min-width: 0; }
.basket-description h2 { font-size: 16px; font-weight: 400; line-height: 1.5; margin: 0 0 4px; overflow-wrap: anywhere; }
.basket-description p { color: #0099ce; font-size: 14px; }
.basket-description .text-danger { color: #b3261e; }
.basket-actions { grid-column: 4; grid-row: 1; display: flex; flex-direction: column-reverse; align-items: flex-end; gap: 22px; padding: 0; background: transparent; }
.managed-basket .basket-actions .btn { background: #f1f1f1; border: 1px solid transparent; color: #222; font-size: 12px; font-weight: 400; padding: 8px 15px; min-height: 36px; }
.managed-basket .basket-actions .btn:hover { background: #e3e3e3; }
.basket-actions .fa { font-size: 16px; color: #777; }
.basket-price { grid-column: 3; grid-row: 1; text-align: right; white-space: nowrap; padding-top: 8px; }
.basket-price del { display: block; color: #777; font-size: 13px; }
.basket-price strong { font-size: 16px; font-weight: 400; }
.basket-summary { max-width: 370px; margin: 52px 0 0 auto; padding: 30px; background: #f2f2f2; text-align: right; }
.basket-summary h2 { display: flex; justify-content: flex-end; align-items: baseline; gap: 28px; font-size: 15px; font-weight: 400; margin: 0 0 12px; }
.basket-summary h2 strong { font-size: 24px; font-weight: 400; }
.basket-delivery-note { font-size: 13px; color: #666; margin-bottom: 28px; }
.managed-basket .basket-summary .btn { width: auto; min-width: 180px; background: #39a137; border-color: #39a137; color: white; text-transform: uppercase; font-size: 15px; font-weight: 700; padding: 17px 28px; }
.managed-basket .basket-summary .btn:hover { background: #2f872d; border-color: #2f872d; }
.managed-basket button:focus-visible, .managed-basket a:focus-visible { outline: 2px solid #0772aa; outline-offset: 3px; }
.basket-campaign { padding: 20px; background: #f2f2f2; margin-bottom: 24px; }
.basket-continue { margin: 0; padding: 16px 0; border-bottom: 1px solid #ddd; }
.basket-continue a { color: #777; }
.basket-continue span { margin-right: 8px; font-size: 22px; vertical-align: -1px; }
@media (max-width: 767px) {
 .managed-basket .page-header { margin-bottom: 32px; }
 .basket-line { grid-template-columns: 80px minmax(0,1fr); gap: 12px 16px; padding: 20px 0; }
 .basket-image { width: 80px; height: 80px; }
 .basket-description { grid-column: 2; }
 .basket-price { grid-column: 2; grid-row: 2; text-align: left; padding-top: 0; }
 .basket-actions { grid-column: 2; grid-row: 3; flex-direction: row; align-items: center; gap: 12px; }
 .managed-basket .basket-actions .btn { min-height: 44px; }
 .basket-summary { max-width: none; margin-top: 28px; padding: 24px; }
 .managed-basket .basket-summary .btn { width: 100%; }
}