.elementor-193 .elementor-element.elementor-element-529d20f{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--margin-top:35px;--margin-bottom:35px;--margin-left:0px;--margin-right:0px;}.elementor-193 .elementor-element.elementor-element-9216e43{width:var( --container-widget-width, 100% );max-width:100%;--container-widget-width:100%;--container-widget-flex-grow:0;}.elementor-193 .elementor-element.elementor-element-9216e43.elementor-element{--flex-grow:0;--flex-shrink:0;}/* Start custom CSS for shortcode, class: .elementor-element-9216e43 *//* --- Premium Cart Styles --- */

/* 1. මුළු Cart එකම සුදු පාට කාඩ් එකක් තුළට ගැනීම */
.woocommerce-cart .woocommerce {
    background: #ffffff;
    padding: 40px;
    border-radius: 20px; /* රවුම් වූ මුලු */
    box-shadow: 0 15px 40px rgba(255, 64, 105, 0.1); /* මෘදු රෝස පැහැති සෙවනැල්ලක් */
    max-width: 1300px;
    margin: 0 auto;
}

/* 2. Table Header එක තද රෝස (Brand Color) කිරීම */
.woocommerce-cart .shop_table thead th {
    background: linear-gradient(90deg, #FF4069, #ff5c8a); /* Gradient එකක් */
    color: #ffffff; /* සුදු අකුරු */
    font-weight: 600;
    text-transform: uppercase;
    font-size: 14px;
    letter-spacing: 1px;
    border: none;
    padding: 18px;
}

/* 3. පේළි (Rows) අතර ඉඩ වැඩි කිරීම */
.woocommerce-cart .shop_table td {
    border-top: 1px solid #f0f0f0; /* ඉතාම ලා පාට ඉරක් */
    padding: 25px 15px; /* ඉඩකඩ වැඩි කිරීම */
    background: #fff;
    color: #555;
    font-size: 16px;
}

/* 4. Product Remove (X) Button එක රවුම් කිරීම */
.woocommerce a.remove {
    background: #ffe6eb !important;
    color: #FF4069 !important;
    border: none !important;
    border-radius: 50% !important;
    width: 30px;
    height: 30px;
    line-height: 28px; /* මැදට ගැනීම */
    transition: 0.3s;
}
.woocommerce a.remove:hover {
    background: #FF4069 !important;
    color: white !important;
    transform: rotate(90deg); /* කැරකෙන ඇනිමේෂන් එකක් */
}

/* 5. Coupon Input Field එක ලස්සන කිරීම */
.coupon input.input-text {
    border: 2px solid #ffe6eb !important;
    border-radius: 30px !important; /* කැප්සියුල් හැඩය */
    padding: 10px 20px !important;
    background: #fffbfb;
    width: 150px !important;
}

/* 6. Buttons (Apply Coupon / Update Cart) */
button[name="apply_coupon"], button[name="update_cart"] {
    background: transparent !important;
    border: 2px solid #FF4069 !important;
    color: #FF4069 !important;
    border-radius: 30px !important;
    padding: 10px 25px !important;
    font-weight: 600;
    transition: 0.3s;
}
button[name="apply_coupon"]:hover, button[name="update_cart"]:hover {
    background: #FF4069 !important;
    color: white !important;
}

/* 7. Cart Totals Box එකට නවීන පෙනුමක් */
.cart-collaterals .cart_totals {
    background: #fff5f7; /* ඉතාම ලා රෝස */
    padding: 30px;
    border-radius: 20px;
    border: none !important; /* Border එක අයින් කරා */
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
}

.cart-collaterals .cart_totals h2 {
    color: #333;
    font-size: 20px;
    border-bottom: 2px dashed #FF4069; /* ඉරක් වෙනුවට තිත් ඉරක් */
    padding-bottom: 15px;
    margin-bottom: 20px;
}

/* 8. Proceed to Checkout Button එකට Glow Effect එකක් */
.wc-proceed-to-checkout a.checkout-button {
    background: linear-gradient(45deg, #FF4069, #ff7b9c) !important;
    box-shadow: 0 10px 20px rgba(255, 64, 105, 0.4); /* Glow */
    font-size: 18px !important;
    padding: 18px 40px !important;
    transition: all 0.3s ease;
}
.wc-proceed-to-checkout a.checkout-button:hover {
    transform: translateY(-3px); /* උඩට පාවෙන ගතිය */
    box-shadow: 0 15px 30px rgba(255, 64, 105, 0.5);
}





/* --- Empty Cart & Alerts Styling --- */

/* 1. "Return to Shop" Button එක සම්පූර්ණයෙන්ම සැඟවීම */
.woocommerce-cart .return-to-shop {
    display: none !important;
}

/* 2. "Item Removed" Message එක (කොළ පාට කොටුව) ලස්සන කිරීම */
.woocommerce-message {
    border-top: none !important; /* පරණ කොළ පාට ඉර අයින් කිරීම */
    border-left: 5px solid #FF4069 !important; /* වම් පැත්තට තද රෝස ඉරක් */
    background-color: #fff0f3 !important; /* ඉතාම ලා රෝස පසුබිමක් */
    color: #800000 !important; /* තද රතු/දුඹුරු අකුරු */
    border-radius: 10px;
    padding: 15px 45px !important;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    font-weight: 500;
}

/* Success Icon එකේ පාට වෙනස් කිරීම */
.woocommerce-message::before {
    color: #FF4069 !important;
}

/* "Undo" Link එකේ ස්ටයිල් එක */
.woocommerce-message a {
    color: #FF4069 !important;
    font-weight: 800;
    text-decoration: underline;
}
.woocommerce-message a:hover {
    color: #d63356 !important;
    text-decoration: none;
}

/* 3. "Your cart is currently empty" Message එක (නිල් පාට කොටුව) වෙනස් කිරීම */
.woocommerce-info {
    border-top: none !important; /* නිල් පාට ඉර අයින් කිරීම */
    background: transparent !important; /* අළු පාට පසුබිම අයින් කිරීම */
    color: #888 !important; /* අකුරු පාට */
    font-size: 20px !important;
    text-align: center; /* මැදට ගැනීම */
    padding: 60px 20px !important;
    
    /* වටේට ලස්සන Dashed Border එකක් */
    border: 2px dashed #FFD1DC !important; 
    border-radius: 20px;
    margin-top: 30px;
    
    /* Flexbox භාවිතා කර මැදට ගැනීම */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

/* Default Icon එක අයින් කිරීම */
.woocommerce-info::before {
    display: none !important;
}

/* 4. හිස් Cart එකට ලස්සන Icon එකක් එකතු කිරීම (Optional) */
.woocommerce-info::after {
    content: "🛒"; /* Cart Emoji එකක් (හෝ ඔබට කැමති නම් "💔" වගේ එකක් දාන්න පුළුවන්) */
    font-size: 60px;
    margin-bottom: 20px;
    opacity: 0.3; /* Icon එක ටිකක් ලා පාටින් පෙන්වීම */
    order: -1; /* අකුරු වලට උඩින් පෙන්වීම */
}/* End custom CSS */