/* CCJ 10719.css */
/* ============================================================
   VINASOCKS - CLASSIC WOOCOMMERCE CART STYLE LIKE ELEMENTOR
   Dùng cho trang [woocommerce_cart]
   ============================================================ */

body.woocommerce-cart {
    --vs-orange: #ff7f24;
    --vs-orange-hover: #ff7649;
    --vs-black: #0a0a0a;
    --vs-text: #121212;
    --vs-muted: #666666;
    --vs-border: #dedddd;
    --vs-soft-bg: #f6f3f2;
    --vs-light-orange: #fee7de;
    --vs-radius: 10px;
    --vs-gap: 30px;
}

/* ============================================================
   CONTAINER
   ============================================================ */

body.woocommerce-cart #content.site-content,
body.woocommerce-cart .site-content,
body.woocommerce-cart .inside-article,
body.woocommerce-cart .entry-content {
    width: 100% !important;
    max-width: 1650px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}

body.woocommerce-cart .entry-title,
body.woocommerce-cart header.entry-header {
    display: none !important;
}

/* ============================================================
   DESKTOP LAYOUT - 2 CỘT
   ============================================================ */

@media (min-width: 1025px) {

    body.woocommerce-cart .entry-content > .woocommerce {
        display: grid !important;
        grid-template-columns: 59% auto !important;
        column-gap: var(--vs-gap) !important;
        row-gap: var(--vs-gap) !important;
        align-items: stretch !important;
        width: 100% !important;
    }

    body.woocommerce-cart .woocommerce-notices-wrapper,
    body.woocommerce-cart #suggested-coupon-wrapper,
    body.woocommerce-cart .woocommerce-message,
    body.woocommerce-cart .woocommerce-error,
    body.woocommerce-cart .woocommerce-info {
        grid-column: 1 / -1 !important;
        width: 100% !important;
    }

    body.woocommerce-cart form.woocommerce-cart-form {
        grid-column: 1 !important;
        width: 100% !important;
        margin: 0 !important;
    }

    body.woocommerce-cart .cart-collaterals {
        grid-column: 2 !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    body.woocommerce-cart .cart-collaterals .cart_totals {
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
        clear: none !important;
        margin: 0 !important;
    }
}

/* ============================================================
   CART FORM CARD
   ============================================================ */

body.woocommerce-cart form.woocommerce-cart-form {
    background: #ffffff !important;
    border: 1px solid var(--vs-border) !important;
    border-radius: var(--vs-radius) !important;
    padding: 20px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

/* ============================================================
   CART TABLE
   ============================================================ */

body.woocommerce-cart table.shop_table,
body.woocommerce-cart table.shop_table_responsive {
    border: none !important;
    margin: 0 !important;
    border-collapse: collapse !important;
    width: 100% !important;
    background: transparent !important;
}

body.woocommerce-cart table.shop_table thead {
    background: transparent !important;
}

body.woocommerce-cart table.shop_table th {
    color: var(--vs-black) !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    text-transform: none !important;
    padding: 0 0 24px 0 !important;
    border: none !important;
    background: transparent !important;
}

body.woocommerce-cart table.shop_table td {
    border-top: 1px solid var(--vs-border) !important;
    padding: 10px 0 !important;
    vertical-align: middle !important;
    color: var(--vs-text) !important;
    font-size: 15px !important;
    background: transparent !important;
}

/* ============================================================
   REMOVE BUTTON - DESKTOP
   ============================================================ */

body.woocommerce-cart table.cart td.product-remove {
    width: 25px !important;
    min-width: 25px !important;
    padding-right: 5px !important;
    padding-left: 0 !important;
    text-align: center !important;
}

body.woocommerce-cart table.cart td.product-remove a.remove {
    width: 20px !important;
    height: 20px !important;
    margin: 0 5px 0 0 !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    color: #121212 !important;
    background: transparent !important;
    border: 1px solid #121212 !important;
    border-radius: 50% !important;

    font-size: 15px !important;
    line-height: 1 !important;
    text-decoration: none !important;
}

body.woocommerce-cart table.cart td.product-remove a.remove:hover {
    color: var(--vs-orange) !important;
    border-color: var(--vs-orange) !important;
    background: transparent !important;
}

/* ============================================================
   PRODUCT IMAGE
   ============================================================ */

body.woocommerce-cart table.cart td.product-thumbnail {
    padding-left: 0 !important;
}

body.woocommerce-cart table.cart img,
body.woocommerce-cart .woocommerce-cart-form__cart-item img {
    width: 55px !important;
    height: auto !important;
    object-fit: cover !important;
    border-radius: 5px !important;
}

/* ============================================================
   PRODUCT TEXT
   ============================================================ */

body.woocommerce-cart .product-name a {
    color: var(--vs-black) !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
    text-decoration: none !important;
}

body.woocommerce-cart .product-name a:hover {
    color: var(--vs-orange) !important;
}

body.woocommerce-cart .product-price,
body.woocommerce-cart .product-subtotal,
body.woocommerce-cart .product-price .amount,
body.woocommerce-cart .product-subtotal .amount {
    color: var(--vs-text) !important;
    font-size: 15px !important;
    font-weight: 500 !important;
}

body.woocommerce-cart .product-subtotal .amount {
    color: var(--vs-orange) !important;
    font-weight: 700 !important;
}

/* ============================================================
   QUANTITY
   ============================================================ */

body.woocommerce-cart .quantity {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 125px !important;
    height: 44px !important;

    border: 1px solid var(--vs-orange) !important;
    border-radius: 999px !important;
    overflow: hidden !important;
    background: #fff !important;
}

body.woocommerce-cart .quantity input.qty {
    width: 50px !important;
    height: 42px !important;

    border: none !important;
    background: transparent !important;
    color: var(--vs-black) !important;

    font-size: 15px !important;
    font-weight: 600 !important;
    text-align: center !important;

    padding: 0 !important;
    box-shadow: none !important;
    outline: none !important;
}

body.woocommerce-cart .quantity .minus,
body.woocommerce-cart .quantity .plus,
body.woocommerce-cart button.minus,
body.woocommerce-cart button.plus {
    width: 36px !important;
    height: 42px !important;

    border: none !important;
    background: transparent !important;
    color: var(--vs-orange) !important;

    font-size: 18px !important;
    font-weight: 600 !important;
    padding: 0 !important;
    line-height: 1 !important;
    cursor: pointer !important;
}

/* ============================================================
   CART ACTIONS
   ============================================================ */

body.woocommerce-cart table.cart td.actions {
    padding-top: 28px !important;
    border-top: 1px solid var(--accent, #ff7f24) !important;
}

/* Ẩn coupon gốc nếu đã dùng coupon custom trong cart totals */
body.woocommerce-cart table.cart td.actions .coupon {
    display: none !important;
}

body.woocommerce-cart table.cart td.actions button[name="update_cart"] {
    height: 42px !important;
    min-height: 42px !important;

    border-radius: 10px !important;
    background: var(--accent, #ff7f24) !important;
    color: #fff !important;
    border: none !important;

    padding: 0 20px !important;

    font-size: 14px !important;
    font-weight: 500 !important;
    text-transform: none !important;
}

body.woocommerce-cart table.cart td.actions button[name="update_cart"]:not(:disabled) {
    background: var(--vs-orange) !important;
}

body.woocommerce-cart table.cart td.actions button[name="update_cart"]:hover:not(:disabled) {
    background: var(--vs-orange-hover) !important;
}

/* ============================================================
   CART TOTALS CARD
   ============================================================ */

body.woocommerce-cart .cart_totals {
    background: #ffffff !important;
    border: 1px solid var(--vs-border) !important;
    border-radius: var(--vs-radius) !important;
    padding: 20px !important;
    box-sizing: border-box !important;
}

body.woocommerce-cart .cart_totals h2 {
    color: var(--vs-black) !important;

    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    text-transform: uppercase !important;

    margin: 0 0 10px 0 !important;
    padding: 0 !important;
}

body.woocommerce-cart .cart_totals table.shop_table {
    border: none !important;
    margin: 0 0 20px 0 !important;
    width: 100% !important;
    border-collapse: collapse !important;
}

body.woocommerce-cart .cart_totals table.shop_table th,
body.woocommerce-cart .cart_totals table.shop_table td {
    border-top: 1px solid var(--vs-border) !important;
    padding: 15px 0 !important;
    background: transparent !important;
    color: var(--vs-text) !important;
    font-size: 15px !important;
    vertical-align: top !important;
}

body.woocommerce-cart .cart_totals table.shop_table tr:first-child th,
body.woocommerce-cart .cart_totals table.shop_table tr:first-child td {
    border-top: none !important;
}

body.woocommerce-cart .cart_totals table.shop_table th {
    font-weight: 500 !important;
    width: 42% !important;
}

body.woocommerce-cart .cart_totals table.shop_table td {
    text-align: right !important;
    font-weight: 500 !important;
}

body.woocommerce-cart .cart_totals .order-total th,
body.woocommerce-cart .cart_totals .order-total td {
    font-size: 16px !important;
    font-weight: 700 !important;
}

body.woocommerce-cart .cart_totals .order-total .amount {
    color: var(--vs-orange) !important;
    font-size: 24px !important;
    font-weight: 800 !important;
}

/* ============================================================
   SHIPPING
   ============================================================ */

body.woocommerce-cart .cart_totals .woocommerce-shipping-destination,
body.woocommerce-cart .cart_totals .woocommerce-shipping-methods,
body.woocommerce-cart .cart_totals .shipping-calculator-button {
    color: #606774 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;
}

body.woocommerce-cart .cart_totals .woocommerce-shipping-destination strong {
    color: #606774 !important;
    font-weight: 800 !important;
}

/* ============================================================
   CUSTOM COUPON TRONG CART TOTALS
   ============================================================ */

body.woocommerce-cart {
    --vs-cart-primary: var(--e-global-color-primary, var(--accent, #ff7f24));
}

body.woocommerce-cart .vs-cart-coupon-row td {
    padding: 22px 0 !important;
    border-top: 1px solid var(--vs-border) !important;
    border-bottom: 1px solid var(--vs-border) !important;
}

body.woocommerce-cart #custom-coupon-container {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

body.woocommerce-cart .custom-coupon-title {
    font-size: 14px !important;
    font-weight: 700 !important;
    margin: 0 0 12px 0 !important;
    padding: 0 !important;
    color: #8c6a5e !important;
    text-transform: uppercase !important;
    line-height: 1.2 !important;
    text-align: left !important;
}

body.woocommerce-cart .custom-coupon-input-group {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin-bottom: 10px !important;
    width: 100% !important;
}

body.woocommerce-cart #fake_coupon_input {
    flex: 1 1 auto !important;
    width: 100% !important;
    height: 45px !important;
    min-height: 45px !important;

    border-radius: 30px !important;
    background-color: #f4f0ef !important;
    border: 1px solid var(--vs-cart-primary) !important;

    padding: 10px 20px !important;
    outline: none !important;
    box-shadow: none !important;

    color: #121212 !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    box-sizing: border-box !important;
}

body.woocommerce-cart #fake_coupon_input::placeholder {
    color: #999 !important;
    opacity: 1 !important;
}

body.woocommerce-cart #fake_coupon_input:focus {
    border-color: var(--vs-cart-primary) !important;
    box-shadow: 0 0 0 2px rgba(255, 127, 36, 0.12) !important;
}

body.woocommerce-cart #fake_coupon_btn {
    flex: 0 0 auto !important;
    height: 45px !important;
    min-height: 45px !important;

    border-radius: 30px !important;
    background-color: transparent !important;
    color: #dd6b4d !important;
    border: 2px solid var(--vs-cart-primary) !important;

    padding: 0 25px !important;

    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;

    cursor: pointer !important;
    transition: all 0.3s ease !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
}

body.woocommerce-cart #fake_coupon_btn:hover,
body.woocommerce-cart #fake_coupon_btn:focus {
    background-color: var(--vs-cart-primary) !important;
    color: #fff !important;
    border-color: var(--vs-cart-primary) !important;
}

body.woocommerce-cart #fake_coupon_btn:disabled {
    opacity: 0.65 !important;
    cursor: not-allowed !important;
}

body.woocommerce-cart #custom-coupon-error-holder {
    width: 100% !important;
    margin-top: 10px !important;
}

body.woocommerce-cart #custom-coupon-error-holder .woocommerce-error,
body.woocommerce-cart #custom-coupon-error-holder .woocommerce-message,
body.woocommerce-cart #custom-coupon-error-holder .woocommerce-info {
    background: transparent !important;
    border: none !important;
    color: #333 !important;

    padding: 0 !important;
    margin: 10px 0 0 0 !important;

    font-size: 14px !important;
    font-weight: 300 !important;
    line-height: 1.4 !important;

    list-style: none !important;
    box-shadow: none !important;
}

body.woocommerce-cart #custom-coupon-error-holder .woocommerce-error::before,
body.woocommerce-cart #custom-coupon-error-holder .woocommerce-message::before,
body.woocommerce-cart #custom-coupon-error-holder .woocommerce-info::before {
    display: none !important;
    content: none !important;
}

body.woocommerce-cart #custom-coupon-error-holder .woocommerce-error li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Không để style input tổng đơn hàng đè vào fake_coupon_input */
body.woocommerce-cart .cart_totals input[type="text"]:not(#fake_coupon_input),
body.woocommerce-cart .cart_totals input.input-text:not(#fake_coupon_input) {
    height: 44px !important;
    border: 1px solid var(--vs-orange) !important;
    border-radius: 999px !important;
    padding: 0 18px !important;
    color: var(--vs-text) !important;
    background: #fff !important;
    box-shadow: none !important;
}

body.woocommerce-cart .cart_totals button.button:not(#fake_coupon_btn),
body.woocommerce-cart .cart_totals input[type="submit"] {
    height: 44px !important;
    min-height: 44px !important;
    border-radius: 999px !important;
    background: #fff !important;
    color: var(--vs-orange) !important;
    border: 1px solid var(--vs-orange) !important;
    padding: 0 26px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

body.woocommerce-cart .cart_totals button.button:not(#fake_coupon_btn):hover,
body.woocommerce-cart .cart_totals input[type="submit"]:hover {
    background: var(--vs-orange) !important;
    color: #fff !important;
}

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

body.woocommerce-cart .wc-proceed-to-checkout {
    padding: 0 !important;
    margin: 20px 0 0 0 !important;
}

body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
    width: 100% !important;
    height: 54px !important;
    min-height: 54px !important;

    border-radius: 50px !important;
    background: var(--vs-orange) !important;
    color: #ffffff !important;
    border: none !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    text-transform: capitalize !important;
    text-decoration: none !important;

    padding: 0 24px !important;
    margin: 0 !important;
}

body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover {
    background: var(--vs-orange-hover) !important;
    color: #ffffff !important;
}

/* ============================================================
   SUGGESTED COUPON BOX
   ============================================================ */

body.woocommerce-cart #suggested-coupon-wrapper {
    margin: 0 !important;
}

body.woocommerce-cart .suggested-coupon-box {
    width: 100% !important;
    background: #fff5f2 !important;
    border: 1px dashed var(--vs-orange) !important;
    border-radius: 8px !important;
    padding: 15px 20px !important;
    box-sizing: border-box !important;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 20px !important;
    margin: 0 !important;
}

body.woocommerce-cart .sc-content {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
}

body.woocommerce-cart .sc-icon {
    font-size: 22px !important;
    line-height: 1 !important;
}

body.woocommerce-cart .sc-text {
    color: #333 !important;
    font-size: 15px !important;
    line-height: 1.4 !important;
    font-weight: 600 !important;
}

body.woocommerce-cart .sc-text strong {
    color: var(--vs-orange) !important;
    font-weight: 800 !important;
}

body.woocommerce-cart .sc-btn {
    background: var(--vs-orange) !important;
    color: #fff !important;
    border-radius: 5px !important;
    padding: 10px 24px !important;
    min-width: 120px !important;
    text-align: center !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

body.woocommerce-cart .sc-btn:hover {
    background: var(--vs-orange-hover) !important;
    color: #fff !important;
}

/* ============================================================
   FREE SHIPPING NOTICE
   ============================================================ */

body.woocommerce-cart .free-shipping-notice,
body.woocommerce-cart .vs-free-shipping-notice {
    background: #fff5f2 !important;
    border: 1px solid var(--vs-orange) !important;
    border-radius: 10px !important;
    padding: 18px 20px !important;
    color: var(--vs-black) !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    margin-top: 10px !important;
}

/* ============================================================
   WOOCOMMERCE NOTICES
   ============================================================ */

body.woocommerce-cart .woocommerce-message,
body.woocommerce-cart .woocommerce-info,
body.woocommerce-cart .woocommerce-error {
    border: 1px dashed var(--vs-orange) !important;
    border-radius: 8px !important;
    background: #fff5f2 !important;
    color: var(--vs-text) !important;
    padding: 15px 20px !important;
    margin: 0 0 10px 0 !important;
}

/* ============================================================
   TABLET
   ============================================================ */

@media (max-width: 1024px) {

    body.woocommerce-cart .inside-article {
        padding: 4% 4% !important;
    }

    body.woocommerce-cart .entry-content > .woocommerce {
        display: block !important;
    }

    body.woocommerce-cart form.woocommerce-cart-form,
    body.woocommerce-cart .cart-collaterals,
    body.woocommerce-cart .cart-collaterals .cart_totals {
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
        clear: both !important;
    }

    body.woocommerce-cart .cart-collaterals {
        margin-top: 28px !important;
    }
}

/* ============================================================
   MOBILE
   ============================================================ */

@media (max-width: 767px) {

    body.woocommerce-cart .inside-article {
        padding: 25px 2% !important;
    }

    body.woocommerce-cart form.woocommerce-cart-form,
    body.woocommerce-cart .cart_totals {
        padding: 20px !important;
        border-radius: 8px !important;
    }

    body.woocommerce-cart table.shop_table thead {
        display: none !important;
    }

    body.woocommerce-cart table.shop_table,
    body.woocommerce-cart table.shop_table tbody,
    body.woocommerce-cart table.shop_table tr,
    body.woocommerce-cart table.shop_table td {
        display: block !important;
        width: 100% !important;
    }

    body.woocommerce-cart table.cart tr.woocommerce-cart-form__cart-item,
    body.woocommerce-cart table.cart tr.cart_item {
        display: grid !important;
        grid-template-columns: 20px 70px minmax(0, 1fr) !important;
        column-gap: 5px !important;
        align-items: start !important;
        position: relative !important;
        padding: 18px 0 !important;
        border-top: 1px solid var(--vs-border) !important;
    }

    body.woocommerce-cart table.cart tr.woocommerce-cart-form__cart-item:first-child,
    body.woocommerce-cart table.cart tr.cart_item:first-child {
        border-top: none !important;
    }

    body.woocommerce-cart table.shop_table td {
        border: none !important;
        padding: 4px 0 !important;
        text-align: left !important;
    }

    body.woocommerce-cart table.cart td.product-remove {
        display: flex !important;
        grid-column: 1 !important;
        grid-row: 1 !important;

        position: static !important;
        width: 20px !important;
        min-width: 20px !important;
        max-width: 20px !important;

        padding: 0 !important;
        margin: 0 !important;

        text-align: center !important;
        align-items: flex-start !important;
        justify-content: center !important;
    }

    body.woocommerce-cart table.cart td.product-remove::before {
        display: none !important;
        content: none !important;
    }

    body.woocommerce-cart table.cart td.product-remove a.remove {
        position: static !important;
        margin: 0 !important;

        width: 20px !important;
        height: 20px !important;
        min-width: 20px !important;

        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        font-size: 16px !important;
        line-height: 1 !important;
        color: #121212 !important;
        background: transparent !important;
        border: 1px solid #121212 !important;
        border-radius: 50% !important;
        text-decoration: none !important;
    }

    body.woocommerce-cart table.cart td.product-remove a.remove:hover {
        color: var(--vs-orange) !important;
        border-color: var(--vs-orange) !important;
        background: transparent !important;
    }

    body.woocommerce-cart table.cart td.product-thumbnail {
        display: block !important;
        grid-column: 2 !important;
        grid-row: 1 / span 4 !important;

        width: 70px !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    body.woocommerce-cart table.cart td.product-thumbnail::before {
        display: none !important;
        content: none !important;
    }

    body.woocommerce-cart table.cart td.product-thumbnail img {
        width: 58px !important;
        height: 58px !important;
        object-fit: cover !important;
        display: block !important;
        border-radius: 5px !important;
    }

    body.woocommerce-cart table.cart td.product-name,
    body.woocommerce-cart table.cart td.product-price,
    body.woocommerce-cart table.cart td.product-quantity,
    body.woocommerce-cart table.cart td.product-subtotal {
        grid-column: 3 !important;
        width: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        text-align: left !important;
    }

    body.woocommerce-cart .quantity {
        width: 120px !important;
        height: 42px !important;
        margin-top: 8px !important;
    }

    body.woocommerce-cart table.cart td.actions {
        padding-top: 20px !important;
    }

    body.woocommerce-cart table.cart td.actions button[name="update_cart"] {
        width: 100% !important;
    }

    body.woocommerce-cart .cart_totals table.shop_table th,
    body.woocommerce-cart .cart_totals table.shop_table td {
        display: table-cell !important;
        width: auto !important;
    }

    body.woocommerce-cart .custom-coupon-input-group {
        gap: 8px !important;
    }

    body.woocommerce-cart #fake_coupon_input {
        height: 44px !important;
        min-height: 44px !important;
        padding: 10px 14px !important;
        font-size: 14px !important;
    }

    body.woocommerce-cart #fake_coupon_btn {
        height: 44px !important;
        min-height: 44px !important;
        padding: 0 18px !important;
        font-size: 14px !important;
    }

    body.woocommerce-cart .suggested-coupon-box {
        flex-direction: column !important;
        align-items: stretch !important;
        text-align: center !important;
        gap: 14px !important;
    }

    body.woocommerce-cart .sc-content {
        justify-content: center !important;
    }

    body.woocommerce-cart .sc-btn {
        width: 100% !important;
    }
}

/* ============================================================
   CART - PHÂN TÁCH GIỮA CÁC THÀNH PHẦN 5PX
   Áp dụng cho bảng sản phẩm trong [woocommerce_cart]
   ============================================================ */

/* Desktop / Tablet: tạo khoảng cách ngang giữa các cột */
body.woocommerce-cart form.woocommerce-cart-form table.cart td.product-remove {
    padding-right: 5px !important;
}

body.woocommerce-cart form.woocommerce-cart-form table.cart td.product-thumbnail {
    padding-left: 0 !important;
    padding-right: 5px !important;
}

body.woocommerce-cart form.woocommerce-cart-form table.cart td.product-name {
    padding-left: 5px !important;
    padding-right: 5px !important;
}

body.woocommerce-cart form.woocommerce-cart-form table.cart td.product-price,
body.woocommerce-cart form.woocommerce-cart-form table.cart td.product-quantity,
body.woocommerce-cart form.woocommerce-cart-form table.cart td.product-subtotal {
    padding-left: 5px !important;
    padding-right: 5px !important;
}

/* Không cho ảnh dính sát text */
body.woocommerce-cart form.woocommerce-cart-form table.cart td.product-thumbnail img {
    margin-right: 5px !important;
}

/* Mobile: giữ nút xoá - ảnh - thông tin cách nhau đúng 5px */
@media (max-width: 767px) {

    body.woocommerce-cart table.cart tr.woocommerce-cart-form__cart-item,
    body.woocommerce-cart table.cart tr.cart_item {
        grid-template-columns: 20px 70px minmax(0, 1fr) !important;
        column-gap: 5px !important;
    }

    body.woocommerce-cart table.cart td.product-remove {
        margin-right: 0 !important;
        padding-right: 0 !important;
    }

    body.woocommerce-cart table.cart td.product-thumbnail {
        padding-right: 0 !important;
    }

    body.woocommerce-cart table.cart td.product-name,
    body.woocommerce-cart table.cart td.product-price,
    body.woocommerce-cart table.cart td.product-quantity,
    body.woocommerce-cart table.cart td.product-subtotal {
        margin-bottom: 5px !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    body.woocommerce-cart table.cart td.product-subtotal {
        margin-bottom: 0 !important;
    }
}
/* ============================================================
   CART MOBILE FIX - 2026-05-30
   Sửa nhãn trùng trong tổng giỏ hàng và căn lại quantity.
   ============================================================ */

@media (max-width: 767px) {
    body.woocommerce-cart .cart_totals table.shop_table,
    body.woocommerce-cart .cart_totals table.shop_table tbody {
        display: block !important;
        width: 100% !important;
    }

    body.woocommerce-cart .cart_totals table.shop_table tr {
        display: grid !important;
        grid-template-columns: minmax(95px, 38%) minmax(0, 1fr) !important;
        align-items: start !important;
        column-gap: 10px !important;
        width: 100% !important;
        border-top: 1px solid var(--vs-border) !important;
        padding: 14px 0 !important;
    }

    body.woocommerce-cart .cart_totals table.shop_table tr:first-child {
        border-top: none !important;
    }

    body.woocommerce-cart .cart_totals table.shop_table th,
    body.woocommerce-cart .cart_totals table.shop_table td {
        display: block !important;
        width: auto !important;
        border-top: none !important;
        padding: 0 !important;
        vertical-align: top !important;
    }

    body.woocommerce-cart .cart_totals table.shop_table th {
        color: var(--vs-black) !important;
        font-size: 15px !important;
        font-weight: 800 !important;
        line-height: 1.4 !important;
        text-align: left !important;
        word-break: normal !important;
    }

    body.woocommerce-cart .cart_totals table.shop_table td {
        color: #606774 !important;
        font-size: 15px !important;
        line-height: 1.45 !important;
        text-align: right !important;
        word-break: normal !important;
        overflow-wrap: anywhere !important;
    }

    body.woocommerce-cart .cart_totals table.shop_table td::before {
        content: none !important;
        display: none !important;
    }

    body.woocommerce-cart .cart_totals .cart-subtotal td,
    body.woocommerce-cart .cart_totals .order-total td {
        color: var(--vs-black) !important;
        font-weight: 800 !important;
    }

    body.woocommerce-cart .cart_totals .order-total .amount {
        display: inline-block !important;
        color: var(--vs-orange) !important;
        font-size: 24px !important;
        line-height: 1.15 !important;
        white-space: nowrap !important;
    }

    body.woocommerce-cart .cart_totals .vs-cart-coupon-row,
    body.woocommerce-cart .cart_totals tr:has(#custom-coupon-container) {
        display: block !important;
    }

    body.woocommerce-cart .cart_totals .vs-cart-coupon-row td,
    body.woocommerce-cart .cart_totals tr:has(#custom-coupon-container) td {
        display: block !important;
        width: 100% !important;
        text-align: left !important;
    }

    body.woocommerce-cart table.cart td.product-quantity,
    body.woocommerce-cart table.cart td.product-subtotal {
        display: grid !important;
        grid-template-columns: auto minmax(0, 1fr) !important;
        align-items: center !important;
        column-gap: 6px !important;
    }

    body.woocommerce-cart table.cart td.product-quantity::before,
    body.woocommerce-cart table.cart td.product-subtotal::before {
        float: none !important;
        width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        color: var(--vs-black) !important;
        font-weight: 800 !important;
        line-height: 48px !important;
    }

    body.woocommerce-cart table.cart td.product-quantity .quantity {
        justify-self: start !important;
        margin: 0 !important;
        width: 138px !important;
        height: 42px !important;
        padding: 0 !important;
        display: grid !important;
        grid-template-columns: 44px 50px 44px !important;
        align-items: center !important;
    }

    body.woocommerce-cart table.cart td.product-quantity .quantity .qty {
        width: 50px !important;
        height: 40px !important;
        line-height: 40px !important;
        font-size: 16px !important;
    }

    body.woocommerce-cart table.cart td.product-quantity .quantity .minus,
    body.woocommerce-cart table.cart td.product-quantity .quantity .plus {
        width: 44px !important;
        height: 40px !important;
        line-height: 40px !important;
        font-size: 18px !important;
        font-weight: 800 !important;
        touch-action: manipulation !important;
    }

    body.woocommerce-cart table.cart td.product-subtotal .amount {
        line-height: 1.35 !important;
        white-space: nowrap !important;
    }
}

/* CCJ 6451.css */
.cart-collaterals .order-total .woocommerce-Price-amount.amount {
    color:  var( --e-global-color-primary ); !important;     
    font-weight: 800 !important; 
    font-size: 20px !important; 
}

.cart-collaterals .order-total .woocommerce-Price-amount.amount bdi {
    color:  var( --e-global-color-primary ); !important;
}


/* màu cam cho con số ở cột Tạm tính trong bảng sản phẩm */
.woocommerce-cart-form .product-subtotal .woocommerce-Price-amount.amount {
    color:  var( --e-global-color-primary ); !important;      /* Màu cam thương hiệu của bạn */
    font-weight: 700 !important;   /* Độ đậm chữ */
}

/* ký hiệu tiền tệ (VND) */
.woocommerce-cart-form td.product-subtotal .woocommerce-Price-amount.amount,
.woocommerce-cart-form td.product-subtotal .woocommerce-Price-amount.amount * {
    color:  var( --e-global-color-primary ); !important;
    font-weight: 700 !important;
}

/* CCJ 8360.css */
.suggested-coupon-box {
    background: #fff5f0; /* Màu nền cam cực nhạt */
    border: 1px dashed #ff7e47;
    border-radius: 10px;
    padding: 15px 20px;
    margin-bottom: 25px;
    display: flex;
    align-items: center;
    gap: 15px;
    box-shadow: 0 4px 10px rgba(241, 90, 36, 0.05);
    animation: fadeInSlide 0.5s ease;
}

.sc-icon {
    font-size: 24px;
}

.sc-text {
    flex: 1;
    color: #444;
    font-size: 15px;
    line-height: 1.4;
}

.sc-text strong {
    color: #f15a24;
    font-weight: 700;
}

.sc-btn {
    background: var( --e-global-color-primary );
    color: #fff !important;
    text-decoration: none !important;
    padding: 8px 18px;
    border-radius: 6px;
    font-weight: 600;
    font-size: 14px;
    transition: all 0.3s ease;
    white-space: nowrap;
}

.sc-btn:hover {
    background: var( --e-global-color-accent );
    transform: translateY(-2px);
    box-shadow: 0 3px 8px rgba(241, 90, 36, 0.3);
}

/* Hiệu ứng xuất hiện mượt mà */
@keyframes fadeInSlide {
    from { opacity: 0; transform: translateY(-10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Mobile responsive */
@media (max-width: 600px) {
    .suggested-coupon-box {
        flex-direction: column;
        text-align: center;
        padding: 20px;
    }
    .sc-btn {
        width: 100%;
    }
}

/* CCJ 6300.css */
/* ============================================================
   1. CHỈ ÁP DỤNG CHO TRANG GIỎ HÀNG VÀ TRANG SẢN PHẨM
   (LOẠI TRỪ MINI CART BẰNG CÁCH CHỈ NHẮM VÀO NỘI DUNG CHÍNH)
   ============================================================ */


/* 1. Ép tất cả các phần tử trong quantity vào chung 1 khối */
.summary .quantity, 
.woocommerce-cart-form .quantity {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid #ff6b01 !important; /* Tạo khung viền cam bao quanh tất cả */
    border-radius: 50px !important;       /* Bo tròn cả khối */
    background: #fff !important;          /* Nền trắng */
    padding: 0 10px !important;           /* Khoảng cách 2 đầu */
    height: 48px !important;              /* Chiều cao bằng với nút Thêm vào giỏ */
    width: fit-content !important;
    vertical-align: middle !important;
    margin-right: 15px !important;        /* Khoảng cách với nút bên cạnh */
}

/* 2. Xóa bỏ khung viền riêng của ô nhập số (khung đang làm nó bị lệch) */
.summary .quantity .qty,
.woocommerce-cart-form .quantity .qty {
    border: none !important;              /* Xóa viền cũ */
    background: transparent !important;   /* Xóa nền cũ */
    width: 35px !important;
    height: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
    outline: none !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #000 !important;
    text-align: center !important;
}

/* 3. Chỉnh lại nút Plus và Minus để chúng nằm gọn trong khung */
.summary .quantity .plus, 
.summary .quantity .minus,
.woocommerce-cart-form .quantity .plus,
.woocommerce-cart-form .quantity .minus {
    background: transparent !important;
    border: none !important;
    width: 30px !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer;
    font-size: 20px !important;
    color: #ff6b01 !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* 4. Căn chỉnh nút "Thêm vào giỏ hàng" để thẳng hàng tuyệt đối */
.single_add_to_cart_button {
    height: 38px !important;              /* Bằng chiều cao ô số lượng */
    margin-top: 0 !important;
    vertical-align: middle !important;
}

/* Ẩn mũi tên mặc định của trình duyệt */
.quantity input::-webkit-outer-spin-button,
.quantity input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}