/**
 * ScooterDiscounter - Cart Page Styles
 * Complete styling voor 2-kolom layout
 * 
 * Locatie: skin/frontend/scooterdiscounter/default/css/sd-cart.css
 */

/* ============================================================================
   CART PAGE CONTAINER
   ============================================================================ */

.sd-cart-page {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px 60px;
}

/* ============================================================================
   PAGE HEADER (apart block)
   ============================================================================ */

.sd-cart-header {
    max-width: 1200px;
    margin: 0 auto 24px;
    padding: 32px 20px 0;
}

.sd-cart-title {
    font-size: 28px;
    font-weight: 700;
    color: #1f2937;
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
}

.sd-cart-title svg {
    color: var(--sd-orange);
    flex-shrink: 0;
}

.sd-cart-count {
    font-size: 16px;
    font-weight: 500;
    color: #6b7280;
}

/* ============================================================================
   FREE SHIPPING PROGRESS BAR (apart block)
   ============================================================================ */

.sd-shipping-progress {
    background: #fff !important;
    border-radius: 12px !important;
    padding: 16px 20px !important;
    margin: 0 auto 24px !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06) !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    z-index: 1 !important;
    max-width: 1200px;
}

.sd-shipping-message {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    font-size: 15px !important;
    color: #374151 !important;
}

.sd-shipping-message svg {
    color: var(--sd-orange) !important;
    flex-shrink: 0 !important;
    display: inline-block !important;
    width: 22px !important;
    height: 22px !important;
}

.sd-shipping-message strong {
    color: var(--sd-orange) !important;
}

.sd-progress-bar {
    height: 8px !important;
    background: #e5e7eb !important;
    border-radius: 4px !important;
    margin-top: 12px !important;
    overflow: hidden !important;
    display: block !important;
}

.sd-progress-fill {
    height: 100% !important;
    background: linear-gradient(90deg, var(--sd-orange), var(--sd-orange-gradient)) !important;
    border-radius: 4px !important;
    transition: width 0.3s ease !important;
    display: block !important;
}

.sd-shipping-footnote {
    font-size: 12px !important;
    color: #9ca3af !important;
    margin-top: 8px !important;
}

.sd-shipping-success {
    color: #166534 !important;
}

.sd-shipping-success svg {
    color: #22c55e !important;
}

.sd-shipping-success strong {
    color: #166534 !important;
}

.sd-shipping-free .sd-progress-bar {
    display: none !important;
}

/* ============================================================================
   MESSAGES (Coupon feedback, errors, etc)
   ============================================================================ */

.sd-cart-page .messages,
.sd-cart-page .messages ul {
    list-style: none;
    margin: 0 0 20px;
    padding: 0;
}

.sd-cart-page .messages li {
    margin: 0;
}

.sd-cart-page .messages .success-msg,
.sd-cart-page .messages .error-msg,
.sd-cart-page .messages .notice-msg {
    padding: 14px 18px;
    border-radius: 10px;
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
}

.sd-cart-page .messages .success-msg {
    background: #ecfdf5;
    color: #166534;
    border: 1px solid #a7f3d0;
}

.sd-cart-page .messages .success-msg::before {
    content: '✓';
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    background: #22c55e;
    color: white;
    border-radius: 50%;
    font-size: 12px;
    font-weight: bold;
}

.sd-cart-page .messages .error-msg {
    background: #fef2f2;
    color: #991b1b;
    border: 1px solid #fecaca;
}

.sd-cart-page .messages .error-msg::before {
    content: '!';
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    background: #ef4444;
    color: white;
    border-radius: 50%;
    font-size: 12px;
    font-weight: bold;
}

.sd-cart-page .messages .notice-msg {
    background: #fffbeb;
    color: #92400e;
    border: 1px solid #fde68a;
}

.sd-cart-page .messages .notice-msg::before {
    content: 'i';
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    background: #f59e0b;
    color: white;
    border-radius: 50%;
    font-size: 12px;
    font-weight: bold;
    font-style: italic;
}

/* ============================================================================
   MAIN 2-COLUMN LAYOUT
   ============================================================================ */

.sd-cart-layout {
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: 32px;
    align-items: start;
}

.sd-cart-main {
    min-width: 0;
    width: 100%;
}

/* De .cart div moet volledige breedte hebben */
.sd-cart-main .cart {
    width: 100%;
}

.sd-cart-sidebar {
    /* Sidebar container */
}

.sd-sidebar-sticky {
    position: sticky;
    top: 100px;
}

/* ============================================================================
   CART TABLE - Originele Magento klassen
   ============================================================================ */

/* Wrapper styling */
.sd-cart-main .cart-table,
.sd-cart-main table.data-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
    overflow: hidden;
}

/* Table Header */
.sd-cart-page .cart-table thead {
    background: #f9fafb;
    border-bottom: 1px solid #e5e7eb;
}

.sd-cart-page .cart-table thead th {
    padding: 16px 20px;
    font-size: 12px;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    text-align: left;
}

.sd-cart-page .cart-table thead th.col-price,
.sd-cart-page .cart-table thead th.col-qty,
.sd-cart-page .cart-table thead th.col-subtotal {
    text-align: center;
}

/* Table Body - Item Rows */
.sd-cart-page .cart-table tbody tr {
    border-bottom: 1px solid #f3f4f6;
    transition: background 0.15s;
}

.sd-cart-page .cart-table tbody tr:last-child {
    border-bottom: none;
}

.sd-cart-page .cart-table tbody tr:hover {
    background: #fafafa;
}

.sd-cart-page .cart-table tbody td {
    padding: 24px 20px;
    vertical-align: middle;
}

/* Product Image */
.sd-cart-page .product-cart-image {
    width: 100px;
    padding-right: 0;
}

.sd-cart-page .product-cart-image .product-image img {
    width: 80px;
    height: 80px;
    object-fit: contain;
    border-radius: 10px;
    border: 1px solid #e5e7eb;
    background: #f9fafb;
    padding: 4px;
}

.sd-cart-page .product-cart-image .cart-links {
    display: none;
}

/* Product Info */
.sd-cart-page .product-cart-info {
    position: relative;
}

.sd-cart-page .product-cart-info .product-name {
    font-size: 15px;
    font-weight: 600;
    color: #1f2937;
    margin: 0 0 4px;
    line-height: 1.4;
}

.sd-cart-page .product-cart-info .product-name a {
    color: inherit;
    text-decoration: none;
}

.sd-cart-page .product-cart-info .product-name a:hover {
    color: var(--sd-orange);
}

.sd-cart-page .product-cart-sku {
    font-size: 12px;
    color: #9ca3af;
    margin-bottom: 4px;
}

.sd-cart-page .product-cart-sku .label {
    display: none;
}

.sd-cart-page .item-options {
    font-size: 13px;
    color: #6b7280;
    margin: 8px 0 0;
}

.sd-cart-page .item-options dt {
    display: inline;
    font-weight: 500;
}

.sd-cart-page .item-options dt::after {
    content: ': ';
}

.sd-cart-page .item-options dd {
    display: inline;
    margin: 0 12px 0 0;
}

.sd-cart-page .product-cart-info > .btn-remove,
.sd-cart-page .product-cart-info > .btn-remove2 {
    display: none;
}

/* Price Column */
.sd-cart-page .product-cart-price {
    text-align: center;
}

.sd-cart-page .cart-price {
    font-weight: 600;
    color: #1f2937;
    font-size: 15px;
}

/* Quantity Column */
.sd-cart-page .product-cart-actions {
    text-align: center;
}

.sd-cart-page .product-cart-actions .input-text.qty {
    width: 60px;
    height: 40px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    text-align: center;
    font-size: 15px;
    font-weight: 500;
    color: #1f2937;
    transition: border-color 0.15s;
}

.sd-cart-page .product-cart-actions .input-text.qty:focus {
    outline: none;
    border-color: var(--sd-orange);
}

.sd-cart-page .product-cart-actions .btn-update {
    display: none;
}

.sd-cart-page .product-cart-actions .cart-links {
    display: none;
}

/* Subtotal Column */
.sd-cart-page .product-cart-total {
    text-align: center;
}

.sd-cart-page .product-cart-total .cart-price {
    font-weight: 700;
    font-size: 16px;
    color: #1f2937;
}

/* Remove Button */
.sd-cart-page .product-cart-remove {
    text-align: center;
    width: 60px;
}

.sd-cart-page .product-cart-remove .btn-remove,
.sd-cart-page .product-cart-remove .btn-remove2 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: none;
    background: transparent;
    color: #9ca3af;
    cursor: pointer;
    border-radius: 8px;
    transition: all 0.15s;
    font-size: 0;
    text-decoration: none;
}

.sd-cart-page .product-cart-remove .btn-remove::before,
.sd-cart-page .product-cart-remove .btn-remove2::before {
    content: '✕';
    font-size: 16px;
}

.sd-cart-page .product-cart-remove .btn-remove:hover,
.sd-cart-page .product-cart-remove .btn-remove2:hover {
    background: #fef2f2;
    color: #ef4444;
}

/* ============================================================================
   CART TABLE FOOTER / ACTIONS
   ============================================================================ */

.sd-cart-page .cart-table tfoot td {
    padding: 20px 24px;
    background: #f9fafb;
    border-top: 1px solid #e5e7eb;
}

.sd-cart-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
}

.sd-link-continue {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #6b7280;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    transition: color 0.15s;
}

.sd-link-continue:hover {
    color: var(--sd-orange);
}

.sd-link-continue svg {
    flex-shrink: 0;
}

.sd-cart-buttons {
    display: flex;
    gap: 10px;
}

.sd-btn {
    padding: 12px 20px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s;
    border: 1px solid #e5e7eb;
    background: #fff;
    color: #374151;
    line-height: 1;
    font-family: inherit;
}

.sd-btn:hover {
    border-color: var(--sd-orange);
    color: var(--sd-orange);
}

.sd-btn-empty:hover {
    border-color: #ef4444;
    color: #ef4444;
}

.sd-btn-update {
    background: #f3f4f6;
}

/* ============================================================================
   COUPON BLOCK (in sidebar)
   ============================================================================ */

.sd-coupon-block {
    background: #fff;
    border-radius: 16px;
    padding: 20px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
    margin-bottom: 16px;
}

.sd-coupon-block .discount,
.sd-cart-page .discount {
    background: transparent;
    padding: 0;
    box-shadow: none;
    border-radius: 0;
}

.sd-coupon-block .discount h2,
.sd-cart-page .discount h2 {
    font-size: 15px;
    font-weight: 600;
    color: #1f2937;
    margin: 0 0 12px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.sd-coupon-block .discount h2::before {
    content: '';
    display: block;
    width: 18px;
    height: 18px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FF6B00' stroke-width='2'%3E%3Cpath d='M20.59 13.41l-7.17 7.17a2 2 0 01-2.83 0L2 12V2h10l8.59 8.59a2 2 0 010 2.82z'/%3E%3Cline x1='7' y1='7' x2='7.01' y2='7'/%3E%3C/svg%3E") no-repeat center;
    background-size: contain;
}

.sd-coupon-block .discount .discount-form,
.sd-cart-page .discount .discount-form {
    display: flex;
    gap: 10px;
    align-items: center;
}

.sd-coupon-block .discount label,
.sd-cart-page .discount label {
    display: none;
}

.sd-coupon-block .discount .input-text,
.sd-cart-page .discount .input-text {
    flex: 1;
    padding: 12px 14px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
    transition: border-color 0.15s;
    min-width: 0;
    height: 44px;
    box-sizing: border-box;
}

.sd-coupon-block .discount .input-text:focus,
.sd-cart-page .discount .input-text:focus {
    outline: none;
    border-color: var(--sd-orange);
}

.sd-coupon-block .discount .input-text::placeholder,
.sd-cart-page .discount .input-text::placeholder {
    color: #9ca3af;
}

.sd-coupon-block .discount button,
.sd-coupon-block .discount .button,
.sd-cart-page .discount button,
.sd-cart-page .discount .button {
    padding: 12px 16px !important;
    background: #e5e7eb !important;
    border: 1px solid #d1d5db !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #374151 !important;
    cursor: pointer;
    transition: all 0.15s;
    white-space: nowrap;
    margin-top: 0 !important;
    height: 44px;
}

.sd-coupon-block .discount button:hover,
.sd-cart-page .discount button:hover {
    background: #d1d5db !important;
    color: #1f2937 !important;
}

.sd-coupon-block .discount button span,
.sd-coupon-block .discount button span span,
.sd-cart-page .discount button span,
.sd-cart-page .discount button span span {
    background: none !important;
    padding: 0 !important;
    color: #374151 !important;
}

.sd-coupon-wrapper .discount button:hover,
.sd-cart-page .discount button:hover {
    background: var(--sd-orange-hover);
}

/* ============================================================================
   SIDEBAR - SUMMARY BLOCK
   ============================================================================ */

.sd-summary-block {
    background: #fff;
    border-radius: 16px;
    padding: 24px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}

.sd-summary-title {
    font-size: 18px;
    font-weight: 700;
    color: #1f2937;
    margin: 0 0 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid #e5e7eb;
}

/* Totals Table */
.sd-totals-content #shopping-cart-totals-table,
.sd-totals-content table {
    width: 100%;
    border-collapse: collapse;
}

.sd-totals-content #shopping-cart-totals-table tr,
.sd-totals-content table tr {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
}

.sd-totals-content #shopping-cart-totals-table td,
.sd-totals-content table td {
    padding: 0;
    border: none;
}

.sd-totals-content #shopping-cart-totals-table td:first-child,
.sd-totals-content table td:first-child {
    color: #6b7280;
    font-size: 15px;
}

.sd-totals-content #shopping-cart-totals-table td:last-child,
.sd-totals-content table td:last-child {
    font-weight: 500;
    color: #1f2937;
    font-size: 15px;
    text-align: right;
}

/* Grand Total */
.sd-totals-content #shopping-cart-totals-table tfoot tr,
.sd-totals-content table tfoot tr,
.sd-totals-content #shopping-cart-totals-table tr.grand_total,
.sd-totals-content table tr.grand_total {
    border-top: 2px solid #e5e7eb;
    margin-top: 8px;
    padding-top: 16px;
}

.sd-totals-content #shopping-cart-totals-table tfoot td:first-child,
.sd-totals-content #shopping-cart-totals-table tr.grand_total td:first-child {
    font-size: 16px;
    font-weight: 700;
    color: #1f2937;
}

.sd-totals-content #shopping-cart-totals-table tfoot td:last-child,
.sd-totals-content #shopping-cart-totals-table tr.grand_total td:last-child {
    font-size: 24px;
    font-weight: 700;
    color: var(--sd-orange);
}

/* ============================================================================
   CHECKOUT BUTTON
   ============================================================================ */

.sd-checkout-wrapper {
    margin-top: 20px;
}

.sd-checkout-wrapper button,
.sd-checkout-wrapper .button,
.sd-checkout-wrapper .btn-checkout,
.sd-checkout-wrapper .btn-proceed-checkout,
.sd-checkout-wrapper a.btn-checkout {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 16px 24px;
    background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);
    color: #fff !important;
    border: none;
    border-radius: 12px;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.2s;
    box-shadow: 0 4px 14px rgba(34, 197, 94, 0.3);
}

.sd-checkout-wrapper button:hover,
.sd-checkout-wrapper .button:hover,
.sd-checkout-wrapper .btn-checkout:hover,
.sd-checkout-wrapper a.btn-checkout:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(34, 197, 94, 0.4);
}

.sd-checkout-wrapper button span,
.sd-checkout-wrapper button span span {
    background: none !important;
    padding: 0 !important;
    color: #fff !important;
}

/* ============================================================================
   TRUST BADGES
   ============================================================================ */

.sd-trust-badges {
    display: flex;
    justify-content: center;
    gap: 24px;
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #f3f4f6;
}

.sd-trust-badge {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: #6b7280;
}

.sd-trust-badge svg {
    color: #22c55e;
    flex-shrink: 0;
}

/* ============================================================================
   CROSSSELL SECTION
   ============================================================================ */

.sd-crosssell-section {
    margin-top: 48px;
    clear: both;
}

/* Ondersteuning voor verschillende Magento crosssell klassen */
.sd-crosssell-section .crosssell,
.sd-crosssell-section .block-crosssell,
.sd-cart-page .crosssell,
.sd-cart-page .block-crosssell {
    display: block !important;
}

.sd-crosssell-section .crosssell h2,
.sd-crosssell-section .block-crosssell .block-title,
.sd-cart-page .crosssell h2 {
    font-size: 20px;
    font-weight: 700;
    color: #1f2937;
    margin: 0 0 24px;
}

.sd-crosssell-section .crosssell .products-grid,
.sd-crosssell-section .crosssell .product-items,
.sd-crosssell-section .crosssell ul.products-grid,
.sd-cart-page .crosssell .products-grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.sd-crosssell-section .crosssell .products-grid .item,
.sd-crosssell-section .crosssell .products-grid li,
.sd-crosssell-section .crosssell .product-items .product-item,
.sd-cart-page .crosssell .products-grid .item {
    background: #fff;
    border-radius: 12px;
    padding: 16px;
    text-align: center;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
    transition: transform 0.2s, box-shadow 0.2s;
    list-style: none;
}

.sd-crosssell-section .crosssell .products-grid .item:hover,
.sd-cart-page .crosssell .products-grid .item:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.1);
}

.sd-crosssell-section .crosssell .product-image img,
.sd-cart-page .crosssell .product-image img {
    width: 100%;
    aspect-ratio: 1;
    object-fit: contain;
    border-radius: 8px;
    margin-bottom: 12px;
}

.sd-crosssell-section .crosssell .product-name,
.sd-cart-page .crosssell .product-name {
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 8px;
}

.sd-crosssell-section .crosssell .product-name a,
.sd-cart-page .crosssell .product-name a {
    color: #1f2937;
    text-decoration: none;
}

.sd-crosssell-section .crosssell .product-name a:hover,
.sd-cart-page .crosssell .product-name a:hover {
    color: var(--sd-orange);
}

.sd-crosssell-section .crosssell .price-box,
.sd-cart-page .crosssell .price-box {
    margin-bottom: 12px;
}

.sd-crosssell-section .crosssell .price,
.sd-crosssell-section .crosssell .regular-price .price,
.sd-cart-page .crosssell .price {
    font-size: 16px;
    font-weight: 700;
    color: var(--sd-orange);
}

.sd-crosssell-section .crosssell .actions,
.sd-cart-page .crosssell .actions {
    margin-top: 12px;
}

.sd-crosssell-section .crosssell .btn-cart,
.sd-crosssell-section .crosssell button.btn-cart,
.sd-cart-page .crosssell .btn-cart {
    width: 100%;
    padding: 10px 16px;
    background: #f3f4f6;
    border: none;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    color: #374151;
    cursor: pointer;
    transition: all 0.15s;
}

.sd-crosssell-section .crosssell .btn-cart span,
.sd-crosssell-section .crosssell .btn-cart span span,
.sd-cart-page .crosssell .btn-cart span {
    background: none !important;
    padding: 0 !important;
}

.sd-crosssell-section .crosssell .btn-cart:hover,
.sd-cart-page .crosssell .btn-cart:hover {
    background: var(--sd-orange);
    color: #fff;
}

.sd-crosssell-section .crosssell .add-to-links,
.sd-cart-page .crosssell .add-to-links {
    display: none;
}

.sd-crosssell-section .crosssell .btn-cart {
    width: 100%;
    padding: 10px 16px;
    background: #f3f4f6;
    border: none;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    color: #374151;
    cursor: pointer;
    transition: all 0.15s;
}

.sd-crosssell-section .crosssell .btn-cart span,
.sd-crosssell-section .crosssell .btn-cart span span {
    background: none !important;
    padding: 0 !important;
}

.sd-crosssell-section .crosssell .btn-cart:hover {
    background: var(--sd-orange);
    color: #fff;
}

.sd-crosssell-section .crosssell .add-to-links {
    display: none;
}

/* ============================================================================
   EMPTY CART
   ============================================================================ */

.sd-cart-empty {
    background: #fff;
    border-radius: 16px;
    padding: 60px 40px;
    text-align: center;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
    max-width: 500px;
    margin: 40px auto;
}

.sd-empty-icon {
    width: 100px;
    height: 100px;
    background: #f3f4f6;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 24px;
}

.sd-empty-icon svg {
    color: #9ca3af;
}

.sd-empty-title {
    font-size: 22px;
    font-weight: 700;
    color: #1f2937;
    margin: 0 0 8px;
}

.sd-empty-text {
    font-size: 15px;
    color: #6b7280;
    margin: 0 0 24px;
}

.sd-empty-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 28px;
    background: var(--sd-orange);
    color: #fff;
    text-decoration: none;
    border-radius: 10px;
    font-weight: 600;
    font-size: 15px;
    transition: all 0.15s;
}

.sd-empty-btn:hover {
    background: var(--sd-orange-hover);
    color: #fff;
    transform: translateY(-2px);
}

/* ============================================================================
   RESPONSIVE - Tablet
   ============================================================================ */

@media (max-width: 1024px) {
    .sd-cart-layout {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    
    .sd-sidebar-sticky {
        position: static;
    }
    
    .sd-crosssell-section .crosssell .products-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    
    /* Hide mobile footer on tablet/desktop */
    .sd-mobile-footer {
        display: none;
    }
}

/* ============================================================================
   RESPONSIVE - Mobile
   ============================================================================ */


/* ============================================================================
   RESPONSIVE - Mobile
   ============================================================================ */
@media (max-width: 768px) {

    /* === GLOBAL === */
    html.checkout-cart-index,
    body.checkout-cart-index {
        overflow-x: hidden !important;
    }
    
    body.checkout-cart-index {
        padding-bottom: 140px !important;
    }
    
    .sd-cart-page {
        padding: 0 !important;
        max-width: 100vw !important;
        overflow-x: hidden !important;
    }

    /* === HEADER STICKY === */
    .sd-cart-header {
        position: sticky !important;
        top: 0 !important;
        z-index: 100 !important;
        background: #fff !important;
        padding: 12px 16px !important;
        margin: 0 !important;
        border-radius: 0 !important;
        border-bottom: 1px solid #e5e7eb !important;
    }
    
    .sd-cart-title {
        font-size: 17px !important;
        gap: 8px !important;
        margin: 0 !important;
    }
    
    .sd-cart-title svg {
        width: 22px !important;
        height: 22px !important;
    }
    
    .sd-cart-count {
        font-size: 14px !important;
    }

    /* === PROGRESS BAR STICKY === */
    .sd-shipping-progress {
        position: sticky !important;
        top: 52px !important;
        z-index: 99 !important;
        margin: 0 !important;
        padding: 10px 16px !important;
        border-radius: 0 !important;
        background: #fff8f3 !important;
        border-bottom: 1px solid #fed7aa !important;
    }
    
    .sd-shipping-progress.sd-shipping-free {
        background: #f0fdf4 !important;
        border-bottom-color: #bbf7d0 !important;
    }
    
    .sd-shipping-message {
        font-size: 13px !important;
        gap: 8px !important;
        margin: 0 0 8px 0 !important;
    }
    
    .sd-shipping-message svg {
        width: 20px !important;
        height: 20px !important;
    }
    
    .sd-progress-bar {
        height: 6px !important;
        margin: 0 !important;
    }
    
    .sd-shipping-footnote {
        display: none !important;
    }

    /* === LAYOUT === */
    .sd-cart-layout {
        display: block !important;
        padding: 12px !important;
    }
    
    .sd-cart-main {
        margin-bottom: 12px !important;
    }
    
    .sd-cart-main .cart {
        background: transparent !important;
        padding: 0 !important;
        box-shadow: none !important;
    }

    /* === CART TABLE === */
    .sd-cart-page .cart-table,
    .sd-cart-page #shopping-cart-table {
        display: flex !important;
        flex-direction: column !important;
        border: none !important;
        background: transparent !important;
    }
    
    .sd-cart-page .cart-table col,
    .sd-cart-page .cart-table thead {
        display: none !important;
    }
    
    .sd-cart-page .cart-table tbody {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        order: 1 !important;
    }
    
    .sd-cart-page .cart-table tfoot {
        display: block !important;
        order: 2 !important;
        margin-top: 12px !important;
    }
    
    .sd-cart-page .cart-table tfoot tr,
    .sd-cart-page .cart-table tfoot td {
        display: block !important;
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
    }

    /* =========================================================
       PRODUCT CARDS
       ========================================================= */
    
    .sd-cart-page .cart-table tbody tr {
        display: block !important;
        position: relative !important;
        background: #fff !important;
        border-radius: 12px !important;
        padding: 12px !important;
        padding-right: 48px !important;
        box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
        border: none !important;
        min-height: 100px !important;
    }
    
    .sd-cart-page .cart-table tbody tr::before,
    .sd-cart-page .cart-table tbody tr::after {
        display: none !important;
    }
    
    /* Reset TD's */
    .sd-cart-page .cart-table tbody td {
        display: none !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }
    
    /* Verberg RWD labels */
    .sd-cart-page .cart-table tbody td::before {
        display: none !important;
        content: none !important;
    }

    /* --- AFBEELDING --- */
    .sd-cart-page .cart-table tbody td.product-cart-image {
        display: block !important;
        position: absolute !important;
        left: 12px !important;
        top: 12px !important;
        width: 80px !important;
        height: 80px !important;
    }
    
    .sd-cart-page .product-cart-image a.product-image {
        display: block !important;
        width: 80px !important;
        height: 80px !important;
    }
    
    .sd-cart-page .product-cart-image img {
        width: 80px !important;
        height: 80px !important;
        object-fit: cover !important;
        border-radius: 8px !important;
    }
    
    .sd-cart-page .product-cart-image .cart-links {
        display: none !important;
    }

    /* --- PRODUCT INFO --- */
    .sd-cart-page .cart-table tbody td.product-cart-info {
        display: block !important;
        margin-left: 92px !important;
        padding: 0 !important;
    }
    
    /* Verberg remove button in info */
    .sd-cart-page .product-cart-info a.btn-remove,
    .sd-cart-page .product-cart-info a.btn-remove2,
    .sd-cart-page .product-cart-info a[class*="btn-remove"] {
        display: none !important;
    }
    
    /* Verberg eventuele prijs elementen in info (zou niet moeten, maar voor zekerheid) */
    .sd-cart-page .product-cart-info .cart-price,
    .sd-cart-page .product-cart-info .price-box,
    .sd-cart-page .product-cart-info > .price {
        display: none !important;
    }
    
    .sd-cart-page .product-cart-info h2.product-name {
        font-size: 14px !important;
        font-weight: 600 !important;
        line-height: 1.3 !important;
        margin: 0 0 2px 0 !important;
    }
    
    .sd-cart-page .product-cart-info .product-name a {
        color: #1f2937 !important;
        text-decoration: none !important;
    }
    
    .sd-cart-page .product-cart-info .product-cart-sku {
        display: none !important;
    }
    
    .sd-cart-page .product-cart-info .item-options {
        font-size: 12px !important;
        color: #6b7280 !important;
        margin: 0 0 6px 0 !important;
    }
    
    .sd-cart-page .product-cart-info .item-options dt {
        display: inline !important;
        font-weight: normal !important;
        float: none !important;
    }
    
    .sd-cart-page .product-cart-info .item-options dt::after {
        content: ': ' !important;
    }
    
    .sd-cart-page .product-cart-info .item-options dd {
        display: inline !important;
        margin: 0 8px 0 0 !important;
        float: none !important;
    }

    /* --- PRIJS --- */
    /* Er is nu maar 1 prijs kolom in de template */
    .sd-cart-page .cart-table tbody td.product-cart-price {
        display: block !important;
        margin-left: 92px !important;
        margin-top: 4px !important;
    }
    
    /* Verberg RWD ::before label */
    .sd-cart-page td.product-cart-price::before {
        display: none !important;
        content: none !important;
    }
    
    /* Style de prijs - oranje */
    .sd-cart-page td.product-cart-price .cart-price,
    .sd-cart-page td.product-cart-price > span,
    .sd-cart-page td.product-cart-price .price {
        font-size: 16px !important;
        font-weight: 700 !important;
        color: var(--sd-orange) !important;
    }
    
    /* Verberg tax details */
    .sd-cart-page td.product-cart-price .cart-tax-info,
    .sd-cart-page td.product-cart-price .cart-tax-total,
    .sd-cart-page td.product-cart-price .weee {
        display: none !important;
    }
    
    /* --- SUBTOTAAL - Verbergen --- */
    .sd-cart-page .cart-table tbody td.product-cart-total {
        display: none !important;
    }

    /* --- REMOVE BUTTON --- */
    .sd-cart-page .cart-table tbody td.product-cart-remove {
        display: block !important;
        position: absolute !important;
        top: 12px !important;
        right: 12px !important;
        width: 32px !important;
        height: 32px !important;
    }
    
    .sd-cart-page td.product-cart-remove > a,
    .sd-cart-page td.product-cart-remove .btn-remove {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 32px !important;
        height: 32px !important;
        background: #fef2f2 !important;
        border-radius: 8px !important;
        text-decoration: none !important;
        font-size: 0 !important;
        color: transparent !important;
    }
    
    .sd-cart-page td.product-cart-remove > a *,
    .sd-cart-page td.product-cart-remove .btn-remove * {
        display: none !important;
    }
    
    .sd-cart-page td.product-cart-remove > a::before,
    .sd-cart-page td.product-cart-remove .btn-remove::before,
    .sd-cart-page .product-cart-remove a::before,
    .sd-cart-page .product-cart-remove .btn-remove::before {
        content: none !important;
        display: none !important;
    }
    
    .sd-cart-page td.product-cart-remove > a::after,
    .sd-cart-page td.product-cart-remove .btn-remove::after {
        content: '' !important;
        display: block !important;
        width: 16px !important;
        height: 16px !important;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ef4444' stroke-width='2'%3E%3Cpath d='M3 6h18M19 6v14a2 2 0 01-2 2H7a2 2 0 01-2-2V6m3 0V4a2 2 0 012-2h4a2 2 0 012 2v2'/%3E%3C/svg%3E") !important;
        background-size: contain !important;
        background-repeat: no-repeat !important;
    }
    
    .sd-cart-page td.product-cart-remove > a:hover {
        background: #fee2e2 !important;
    }

/* ==========================================
   SD-CART MOBILE FIX - Quantity Layout
   Vervang de bestaande QUANTITY sectie in sd-cart.css
   (rond regel 1395-1441)
   ========================================== */

    /* --- QUANTITY MET +/- KNOPPEN --- */
    .sd-cart-page .cart-table tbody td.product-cart-actions {
        display: block !important;
        margin-left: 92px !important; /* Gelijk met product naam */
        margin-top: 8px !important;
        padding: 0 !important;
        border: none !important;
        clear: none !important;
        width: auto !important;
    }
    
    /* Verberg "Aantal" label */
    .sd-cart-page td.product-cart-actions::before {
        display: none !important;
        content: none !important;
    }
    
    /* Quantity wrapper - we maken deze via JS */
    .sd-cart-page .qty-wrapper {
        display: inline-flex !important;
        align-items: center !important;
        gap: 0 !important;
    }
    
    /* +/- Knoppen */
    .sd-cart-page .qty-btn {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 36px !important;
        height: 36px !important;
        border: 1px solid #e5e7eb !important;
        background: #fff !important;
        color: #374151 !important;
        font-size: 18px !important;
        font-weight: 500 !important;
        cursor: pointer !important;
        transition: all 0.15s ease !important;
        -webkit-tap-highlight-color: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
        line-height: 1 !important;
        -webkit-appearance: none !important;
        appearance: none !important;
    }
    
    .sd-cart-page .qty-btn.qty-minus {
        border-radius: 6px 0 0 6px !important;
        border-right: none !important;
    }
    
    .sd-cart-page .qty-btn.qty-plus {
        border-radius: 0 6px 6px 0 !important;
        border-left: none !important;
    }
    
    .sd-cart-page .qty-btn:active {
        background: #f3f4f6 !important;
        transform: scale(0.95) !important;
    }
    
    /* Quantity input - midden van de groep */
    .sd-cart-page .product-cart-actions input.qty,
    .sd-cart-page .qty-wrapper input.qty {
        width: 44px !important;
        height: 36px !important;
        text-align: center !important;
        border: 1px solid #e5e7eb !important;
        border-radius: 0 !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        background: #fff !important;
        margin: 0 !important;
        padding: 0 !important;
        -moz-appearance: textfield !important;
    }
    
    .sd-cart-page .qty-wrapper input.qty::-webkit-outer-spin-button,
    .sd-cart-page .qty-wrapper input.qty::-webkit-inner-spin-button {
        -webkit-appearance: none !important;
        margin: 0 !important;
    }
    
    /* Input box wrapper verbergen */
    .sd-cart-page .product-cart-actions .input-box,
    .sd-cart-page .product-cart-actions > label {
        display: contents !important;
    }
    
    /* Verberg update button etc */
    .sd-cart-page .product-cart-actions button:not(.qty-btn),
    .sd-cart-page .product-cart-actions .btn-update,
    .sd-cart-page .product-cart-actions .cart-links {
        display: none !important;
    }

    /* --- KLEINERE AFBEELDING --- */
    .sd-cart-page .cart-table tbody .product-cart-image {
        width: 70px !important;
        min-width: 70px !important;
    }
    
    .sd-cart-page .cart-table tbody .product-cart-image img {
        width: 70px !important;
        height: 70px !important;
    }
    
    /* Pas margin aan voor nieuwe image size */
    .sd-cart-page .cart-table tbody td.product-cart-info,
    .sd-cart-page .cart-table tbody td.product-cart-price,
    .sd-cart-page .cart-table tbody td.product-cart-actions {
        margin-left: 82px !important; /* 70px image + 12px gap */
    }


    /* === CART ACTIONS (Leegmaken, Bijwerken, Verder winkelen) === */
    .sd-cart-actions {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        margin-top: 16px !important;
        padding: 16px !important;
        background: #fff !important;
        border-radius: 12px !important;
        box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
    }
    
    .sd-cart-buttons {
        display: flex !important;
        gap: 10px !important;
        order: 1 !important;
    }
    
    .sd-btn {
        flex: 1 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 12px 16px !important;
        border-radius: 10px !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        min-height: 44px !important;
        border: none !important;
        cursor: pointer !important;
    }
    
    .sd-btn-empty {
        background: #fef2f2 !important;
        color: #dc2626 !important;
        border: 1px solid #fecaca !important;
    }
    
    .sd-btn-update {
        background: #f3f4f6 !important;
        color: #374151 !important;
        border: 1px solid #e5e7eb !important;
    }
    
    .sd-link-continue {
        order: 2 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        padding: 12px 20px !important;
        background: #fff !important;
        border: 1px solid #e5e7eb !important;
        border-radius: 10px !important;
        color: #374151 !important;
        font-size: 14px !important;
        font-weight: 500 !important;
        text-decoration: none !important;
    }
    
    .sd-link-continue svg {
        width: 16px !important;
        height: 16px !important;
    }

    /* === SIDEBAR === */
    .sd-cart-sidebar {
        width: 100% !important;
    }
    
    .sd-sidebar-sticky {
        position: static !important;
    }

    /* --- Coupon --- */
    .sd-coupon-block {
        background: #fff !important;
        border-radius: 12px !important;
        padding: 16px !important;
        margin-bottom: 12px !important;
        box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
    }
    
    .sd-coupon-block .discount {
        background: transparent !important;
        padding: 0 !important;
        box-shadow: none !important;
    }
    
    .sd-coupon-block .discount h2 {
        font-size: 14px !important;
        font-weight: 600 !important;
        margin: 0 0 12px 0 !important;
    }
    
    .sd-coupon-block .discount h2::before {
        display: none !important;
    }
    
    .sd-coupon-block .discount form {
        display: flex !important;
        gap: 8px !important;
    }
    
    .sd-coupon-block .discount .input-text {
        flex: 1 !important;
        height: 44px !important;
        padding: 0 14px !important;
        border: 1px solid #e5e7eb !important;
        border-radius: 8px !important;
        font-size: 14px !important;
    }
    
    .sd-coupon-block .discount button {
        height: 44px !important;
        padding: 0 16px !important;
        background: #e5e7eb !important;
        color: #374151 !important;
        border: none !important;
        border-radius: 8px !important;
        font-weight: 600 !important;
    }
    
    .sd-coupon-block .discount button span {
        background: none !important;
        padding: 0 !important;
        color: inherit !important;
    }

    /* --- Summary --- */
    .sd-summary-block {
        background: #fff !important;
        border-radius: 12px !important;
        padding: 16px !important;
        box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
    }
    
    .sd-summary-title {
        font-size: 16px !important;
        font-weight: 700 !important;
        margin: 0 0 12px 0 !important;
    }
    
    .sd-totals-content tr {
        display: flex !important;
        justify-content: space-between !important;
        padding: 6px 0 !important;
        font-size: 14px !important;
        color: #6b7280 !important;
    }
    
    .sd-totals-content tr.grand_total {
        font-size: 18px !important;
        font-weight: 700 !important;
        color: #1f2937 !important;
        border-top: 1px solid #e5e7eb !important;
        padding-top: 12px !important;
        margin-top: 8px !important;
    }
    
    .sd-totals-content td {
        padding: 0 !important;
        border: none !important;
    }
    
    .sd-checkout-wrapper {
        display: none !important;
    }

    .sd-trust-badges {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
        gap: 16px !important;
        margin-top: 16px !important;
        padding-top: 16px !important;
        border-top: 1px solid #e5e7eb !important;
    }
    
    .sd-trust-badge {
        display: flex !important;
        align-items: center !important;
        gap: 6px !important;
        font-size: 11px !important;
        color: #6b7280 !important;
    }

    /* === CROSSSELL SLIDER === */
    .sd-crosssell-section {
        padding: 0 !important;
        margin: 20px 0 !important;
    }
    
    .sd-crosssell-section h2 {
        font-size: 16px !important;
        font-weight: 700 !important;
        margin: 0 0 12px 0 !important;
        padding: 0 12px !important;
    }
    
    .sd-crosssell-section .products-grid,
    .sd-crosssell-section .products-grid--max-3-col,
    .sd-crosssell-section #crosssell-products-list {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 10px !important;
        overflow-x: auto !important;
        scroll-snap-type: x mandatory !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: none !important;
        padding: 4px 12px 12px !important;
        margin: 0 !important;
    }
    
    .sd-crosssell-section .products-grid::-webkit-scrollbar {
        display: none !important;
    }
    
    .sd-crosssell-section li.item,
    .sd-crosssell-section .products-grid > li {
        flex: 0 0 140px !important;
        width: 140px !important;
        min-width: 140px !important;
        scroll-snap-align: start !important;
        background: #fff !important;
        border-radius: 10px !important;
        padding: 10px !important;
        box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
        margin: 0 !important;
        list-style: none !important;
    }
    
    .sd-crosssell-section .product-image {
        height: 100px !important;
        border-radius: 6px !important;
        overflow: hidden !important;
        margin-bottom: 8px !important;
    }
    
    .sd-crosssell-section .product-image img {
        width: 100% !important;
        height: 100px !important;
        object-fit: cover !important;
    }
    
    .sd-crosssell-section .product-name {
        font-size: 12px !important;
        line-height: 1.3 !important;
        height: 32px !important;
        overflow: hidden !important;
        margin-bottom: 4px !important;
    }
    
    .sd-crosssell-section .price {
        font-size: 14px !important;
        font-weight: 700 !important;
        color: var(--sd-orange) !important;
        margin-bottom: 8px !important;
    }
    
    .sd-crosssell-section .btn-cart {
        width: 100% !important;
        height: 32px !important;
        background: #f3f4f6 !important;
        border: none !important;
        border-radius: 6px !important;
        font-size: 11px !important;
        font-weight: 600 !important;
        color: #374151 !important;
    }
    
    .sd-crosssell-section .btn-cart span {
        background: none !important;
        padding: 0 !important;
        color: inherit !important;
        font-size: inherit !important;
    }
    
    .sd-crosssell-section .add-to-links {
        display: none !important;
    }

    /* === MOBILE FOOTER === */
    .sd-mobile-footer {
        display: block !important;
        position: fixed !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        background: #fff !important;
        padding: 12px 16px !important;
        padding-bottom: calc(12px + env(safe-area-inset-bottom)) !important;
        box-shadow: 0 -4px 20px rgba(0,0,0,0.1) !important;
        z-index: 1000 !important;
    }
    
    .sd-mobile-footer-summary {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        margin-bottom: 10px !important;
    }
    
    .sd-mobile-footer-label {
        display: flex !important;
        flex-direction: column !important;
    }
    
    .sd-mobile-total-label {
        font-size: 14px !important;
        color: #6b7280 !important;
    }
    
    .sd-mobile-vat-label {
        font-size: 11px !important;
        color: #9ca3af !important;
    }
    
    .sd-mobile-footer-price {
        font-size: 20px !important;
        font-weight: 700 !important;
    }
    
    .sd-mobile-checkout button,
    .sd-mobile-checkout .btn-checkout {
        width: 100% !important;
        padding: 16px !important;
        background: linear-gradient(135deg, #22c55e, #16a34a) !important;
        color: #fff !important;
        border: none !important;
        border-radius: 12px !important;
        font-size: 16px !important;
        font-weight: 700 !important;
        min-height: 52px !important;
        box-shadow: 0 4px 14px rgba(34, 197, 94, 0.3) !important;
    }
    
    .sd-mobile-checkout button span {
        background: none !important;
        padding: 0 !important;
        color: #fff !important;
        font-size: 16px !important;
        font-weight: 700 !important;
    }

    /* === EMPTY CART === */
    .sd-cart-empty {
        padding: 60px 24px !important;
        margin: 20px 12px !important;
        border-radius: 12px !important;
    }
    
    .sd-empty-title {
        font-size: 18px !important;
    }

} /* End mobile 768px */

/* === Small Mobile === */
@media (max-width: 480px) {
    .sd-cart-title {
        font-size: 16px !important;
    }
    
    .sd-shipping-progress {
        top: 48px !important;
    }
    
    .sd-crosssell-section li.item {
        flex: 0 0 130px !important;
        width: 130px !important;
        min-width: 130px !important;
    }
}

/* === Desktop - Hide mobile === */
@media (min-width: 769px) {
    .sd-mobile-footer {
        display: none !important;
    }
}
/* ==========================================
   CART PAGE - Quantity +/- Buttons Update
   Voeg dit toe aan sd-cart.css (mobile sectie)
   ========================================== */

/* === DESKTOP: Basis qty-wrapper styling === */
.sd-cart-page .qty-wrapper {
    display: inline-flex;
    align-items: center;
    gap: 0;
}

/* Desktop: verberg +/- knoppen, toon alleen input */
.sd-cart-page .qty-btn {
    display: none;
}

.sd-cart-page .qty-wrapper .input-text.qty {
    width: 50px;
    height: 36px;
    text-align: center;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 600;
}

/* ==========================================
   SD-CART MOBILE - COMPLETE FIX
   Vervang de hele @media (max-width: 767px) sectie
   voor cart items en actions
   ========================================== */

@media (max-width: 767px) {

    /* === CART ITEMS - Product Cards === */
    
    /* --- TABLE ROW als card --- */
    .sd-cart-page .cart-table tbody tr {
        display: block !important;
        position: relative !important;
        background: #fff !important;
        border-radius: 12px !important;
        padding: 16px !important;
        padding-right: 50px !important; /* Ruimte voor prullenbak */
        margin-bottom: 12px !important;
        box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
    }

    /* --- AFBEELDING (70x70) --- */
    .sd-cart-page .cart-table tbody td.product-cart-image {
        display: block !important;
        position: absolute !important;
        left: 16px !important;
        top: 16px !important;
        width: 70px !important;
        height: 70px !important;
        padding: 0 !important;
    }
    
    .sd-cart-page .product-cart-image a.product-image {
        display: block !important;
        width: 70px !important;
        height: 70px !important;
    }
    
    .sd-cart-page .product-cart-image img {
        width: 70px !important;
        height: 70px !important;
        object-fit: contain !important;
        border-radius: 8px !important;
        background: #f9fafb !important;
    }
    
    .sd-cart-page .product-cart-image .cart-links {
        display: none !important;
    }

    /* --- PRODUCT INFO (naam) --- */
    .sd-cart-page .cart-table tbody td.product-cart-info {
        display: block !important;
        margin-left: 86px !important; /* 70px image + 16px gap */
        padding: 0 !important;
    }
    
    .sd-cart-page .product-cart-info h2.product-name {
        font-size: 14px !important;
        font-weight: 600 !important;
        line-height: 1.3 !important;
        margin: 0 0 4px 0 !important;
        color: #1f2937 !important;
    }
    
    .sd-cart-page .product-cart-info .product-name a {
        color: #1f2937 !important;
        text-decoration: none !important;
    }
    
    /* Verberg onnodige elementen */
    .sd-cart-page .product-cart-info a.btn-remove,
    .sd-cart-page .product-cart-info a.btn-remove2,
    .sd-cart-page .product-cart-info .product-cart-sku,
    .sd-cart-page .product-cart-info .cart-price,
    .sd-cart-page .product-cart-info .price-box {
        display: none !important;
    }
    
    .sd-cart-page .product-cart-info .item-options {
        font-size: 12px !important;
        color: #6b7280 !important;
        margin: 0 0 4px 0 !important;
    }

    /* --- PRIJS --- */
    .sd-cart-page .cart-table tbody td.product-cart-price {
        display: block !important;
        margin-left: 86px !important;
        margin-top: 2px !important;
        padding: 0 !important;
    }
    
    .sd-cart-page td.product-cart-price::before {
        display: none !important;
        content: none !important;
    }
    
    .sd-cart-page td.product-cart-price .cart-price,
    .sd-cart-page td.product-cart-price .price {
        font-size: 16px !important;
        font-weight: 700 !important;
        color: var(--sd-orange) !important;
    }
    
    /* Verberg tax info */
    .sd-cart-page td.product-cart-price .cart-tax-info,
    .sd-cart-page td.product-cart-price .cart-tax-total {
        display: none !important;
    }
    
    /* --- SUBTOTAAL - Verbergen --- */
    .sd-cart-page .cart-table tbody td.product-cart-total {
        display: none !important;
    }

    /* --- REMOVE BUTTON (rechtsboven) --- */
    .sd-cart-page .cart-table tbody td.product-cart-remove {
        display: block !important;
        position: absolute !important;
        top: 16px !important;
        right: 12px !important;
        width: 32px !important;
        height: 32px !important;
        padding: 0 !important;
    }
    
    .sd-cart-page td.product-cart-remove::before {
        display: none !important;
    }
    
    .sd-cart-page td.product-cart-remove > a,
    .sd-cart-page td.product-cart-remove .btn-remove {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 32px !important;
        height: 32px !important;
        background: #fef2f2 !important;
        border-radius: 8px !important;
        text-decoration: none !important;
        font-size: 0 !important;
        color: transparent !important;
    }
    
    .sd-cart-page td.product-cart-remove > a *,
    .sd-cart-page td.product-cart-remove .btn-remove * {
        display: none !important;
    }
    
    .sd-cart-page td.product-cart-remove > a::after,
    .sd-cart-page td.product-cart-remove .btn-remove::after {
        content: '' !important;
        display: block !important;
        width: 16px !important;
        height: 16px !important;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ef4444' stroke-width='2'%3E%3Cpath d='M3 6h18M19 6v14a2 2 0 01-2 2H7a2 2 0 01-2-2V6m3 0V4a2 2 0 012-2h4a2 2 0 012 2v2'/%3E%3C/svg%3E") !important;
        background-size: contain !important;
        background-repeat: no-repeat !important;
    }

    /* --- QUANTITY met +/- knoppen --- */
    .sd-cart-page .cart-table tbody td.product-cart-actions {
        display: block !important;
        margin-left: 86px !important;
        margin-top: 10px !important;
        padding: 0 !important;
        border: none !important;
        width: auto !important;
    }
    
    /* Verberg "Aantal" label */
    .sd-cart-page td.product-cart-actions::before {
        display: none !important;
        content: none !important;
    }
    
    /* Qty wrapper */
    .sd-cart-page .qty-wrapper {
        display: inline-flex !important;
        align-items: center !important;
        gap: 0 !important;
    }
    
    /* +/- Knoppen */
    .sd-cart-page .qty-btn {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 36px !important;
        height: 36px !important;
        border: 1px solid #e5e7eb !important;
        background: #fff !important;
        color: #374151 !important;
        font-size: 18px !important;
        font-weight: 500 !important;
        cursor: pointer !important;
        transition: all 0.15s ease !important;
        -webkit-tap-highlight-color: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
        line-height: 1 !important;
    }
    
    .sd-cart-page .qty-btn.qty-minus {
        border-radius: 6px 0 0 6px !important;
        border-right: none !important;
    }
    
    .sd-cart-page .qty-btn.qty-plus {
        border-radius: 0 6px 6px 0 !important;
        border-left: none !important;
    }
    
    .sd-cart-page .qty-btn:active {
        background: #f3f4f6 !important;
        transform: scale(0.95) !important;
    }
    
    /* Quantity input */
    .sd-cart-page .qty-wrapper input.qty,
    .sd-cart-page .product-cart-actions input.qty {
        width: 44px !important;
        height: 36px !important;
        text-align: center !important;
        border: 1px solid #e5e7eb !important;
        border-radius: 0 !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        background: #fff !important;
        margin: 0 !important;
        padding: 0 !important;
        -moz-appearance: textfield !important;
    }
    
    .sd-cart-page .qty-wrapper input.qty::-webkit-outer-spin-button,
    .sd-cart-page .qty-wrapper input.qty::-webkit-inner-spin-button {
        -webkit-appearance: none !important;
        margin: 0 !important;
    }
    
    /* Input-box wrapper */
    .sd-cart-page .product-cart-actions .input-box,
    .sd-cart-page .product-cart-actions > label {
        display: contents !important;
    }
    
    /* Verberg update button in quantity cel */
    .sd-cart-page .product-cart-actions button:not(.qty-btn),
    .sd-cart-page .product-cart-actions .btn-update,
    .sd-cart-page .product-cart-actions .cart-links {
        display: none !important;
    }

    /* === CART ACTIONS (Leegmaken, Bijwerken, Verder winkelen) === */
    .sd-cart-actions {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        margin-top: 16px !important;
        padding: 16px !important;
        background: #fff !important;
        border-radius: 12px !important;
        box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
    }
    
    /* Buttons wrapper */
    .sd-cart-buttons {
        display: flex !important;
        gap: 10px !important;
        order: 1 !important;
    }
    
    /* Base button style */
    .sd-btn {
        flex: 1 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 12px 16px !important;
        border-radius: 8px !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        min-height: 44px !important;
        cursor: pointer !important;
        transition: all 0.15s ease !important;
        -webkit-tap-highlight-color: transparent !important;
    }
    
    /* Leegmaken - Oranje outline */
    .sd-btn.sd-btn-empty {
        background: #fff !important;
        color: var(--sd-orange) !important;
        border: 2px solid var(--sd-orange) !important;
    }
    
    .sd-btn.sd-btn-empty:active {
        background: #FFF7ED !important;
    }
    
    /* Bijwerken - Grijs */
    .sd-btn.sd-btn-update {
        background: #f3f4f6 !important;
        color: #374151 !important;
        border: 1px solid #e5e7eb !important;
    }
    
    .sd-btn.sd-btn-update:active {
        background: #e5e7eb !important;
    }
    
    /* Verder winkelen link */
    .sd-link-continue {
        order: 2 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        padding: 12px 16px !important;
        background: #f9fafb !important;
        border: 1px solid #e5e7eb !important;
        border-radius: 8px !important;
        color: #374151 !important;
        font-size: 14px !important;
        font-weight: 500 !important;
        text-decoration: none !important;
    }
    
    .sd-link-continue svg {
        width: 16px !important;
        height: 16px !important;
        flex-shrink: 0 !important;
    }
    
    .sd-link-continue:active {
        background: #f3f4f6 !important;
    }

}

/* ==========================================================================
   QTY BUTTON ENHANCEMENTS
   ========================================================================== */

/* Verwijder 300ms tap delay op mobile */
.sd-cart-page .qty-btn {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    user-select: none;
    -webkit-user-select: none;
}

/* Active state via JavaScript class */
.sd-cart-page .qty-btn.qty-btn-active {
    transform: scale(0.9);
    background: var(--sd-orange);
    color: #fff;
    border-color: var(--sd-orange);
}
