.elementor-kit-21{--e-global-color-primary:#F0616E;--e-global-color-secondary:#4778AB;--e-global-color-text:#7A7A7A;--e-global-color-accent:#94C03D;--e-global-color-e44fe48:#F0616E;--e-global-color-d34ba1a:#4778AB;--e-global-color-c5a2ce0:#FFC313;--e-global-color-a4999c9:#94C03D;--e-global-color-e006db2:#A93D63;--e-global-color-b3138d9:#F6996A;--e-global-color-63bf511:#393636;--e-global-color-6c03a3c:#FFFFFF;--e-global-typography-primary-font-family:"Itim";--e-global-typography-primary-font-weight:500;--e-global-typography-secondary-font-family:"Itim";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Sarabun";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Itim";--e-global-typography-accent-font-weight:400;font-family:"Sarabun", Sans-serif;}.elementor-kit-21 e-page-transition{background-color:#EAF1F4;}.elementor-kit-21 a{font-family:"Itim", Sans-serif;}.elementor-kit-21 h1{font-family:"Itim", Sans-serif;}.elementor-kit-21 h2{font-family:"Itim", Sans-serif;}.elementor-kit-21 h3{font-family:"Itim", Sans-serif;}.elementor-kit-21 h4{font-family:"Itim", Sans-serif;}.elementor-kit-21 h5{font-family:"Itim", Sans-serif;}.elementor-kit-21 h6{font-family:"Itim", Sans-serif;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.elementor-lightbox{background-color:#000000B3;}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS *//* ==========================================================================
   CartV3 — WakaStore
   Restyles the Elementor Pro "Cart" widget to the CartV3 design.

   The widget nests:  .e-cart__container
                        .e-cart__column-start / form / .e-shop-table + .coupon
                        .e-cart__column-end   / .e-cart-totals
   The coupon box therefore lives in the LEFT column, and the product table
   columns come out in the order remove/thumb/name/price/qty/subtotal.

   NOTE: no child combinators anywhere in this file. Elementor HTML-escapes the
   Custom CSS field when it saves, so a ">" is stored as ">" and silently
   kills the whole rule. Descendant .elementor-kit-21s only.

   Both are fixed here by flattening the widget's wrappers with
   `display: contents` so the table, the summary and the coupon become direct
   items of one page-level grid, then placing each one explicitly.
   ========================================================================== */

.wakacart{
    --wk-card:   #FFFFFF;
    --wk-line:   #E6ECF2;
    --wk-ink:    #2F3A45;
    --wk-muted:  #8A97A3;
    --wk-blue:   #3D6FB0;
    --wk-coral:  #F1706B;
    --wk-sale:   #E8524A;
    --wk-radius: 16px;
    --wk-side:   340px;
    --wk-gap:    24px;
}

/* ---------- page grid ---------- */

/* A "boxed" container wraps its children in .e-con-inner, so the grid belongs
   on that inner element - putting it on .e-con itself does nothing, because
   .e-con only ever has the one .e-con-inner child. */
/* The widget already renders its own two-column grid (.e-cart__container), and
   the helper script moves each extra Elementor element into the column it
   belongs to. That gives two real, independent boxes.
   A page-level grid was tried first and cannot work here: grid rows are shared
   across columns, so the promo box could only ever start below the (taller)
   product table, leaving a large hole under the order summary. */
.wakacart-cart.wakacart-cart .e-cart__container{
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--wk-side);
    align-items: start;
    gap: var(--wk-gap);
}
.wakacart-cart.wakacart-cart .e-cart__column-start,
.wakacart-cart.wakacart-cart .e-cart__column-end{ min-width: 0; }
.wakacart-cart.wakacart-cart .e-clear{ display: none; }

/* spacing for the pieces the script relocates */
.wakacart-cart.wakacart-cart .e-cart__column-start .wakacart-continue{ margin-top: var(--wk-gap); }
.wakacart-cart.wakacart-cart .e-cart__column-end .coupon{ margin-top: 16px; }
.wakacart-cart.wakacart-cart .e-cart__column-end .wakacart-aside{ margin-top: 12px; }
.wakacart-cart.wakacart-cart .woocommerce-notices-wrapper{ margin-bottom: var(--wk-gap); }

/* the helper script has no visual output of its own */
.wakacart-js{ display: none; }

/* ---------- notices, matched to the cards ---------- */

.wakacart-cart.wakacart-cart .woocommerce-message,
.wakacart-cart.wakacart-cart .woocommerce-info,
.wakacart-cart.wakacart-cart .woocommerce-error{
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    padding: 16px 20px;
    background: var(--wk-card);
    border: 1px solid var(--wk-line);
    border-left-width: 4px;
    border-radius: var(--wk-radius);
    font-size: 14px;
    line-height: 1.5;
    color: var(--wk-ink);
    list-style: none;
}
.wakacart-cart.wakacart-cart .woocommerce-message{ border-left-color: #7FB800; }
.wakacart-cart.wakacart-cart .woocommerce-info   { border-left-color: var(--wk-blue); }
.wakacart-cart.wakacart-cart .woocommerce-error  { border-left-color: var(--wk-coral); }

/* the tick/exclamation is absolutely positioned by default, which fights the
   flex row above */
.wakacart-cart.wakacart-cart .woocommerce-message::before,
.wakacart-cart.wakacart-cart .woocommerce-info::before,
.wakacart-cart.wakacart-cart .woocommerce-error::before{
    position: static;
    flex: 0 0 auto;
    margin: 0;
    font-size: 17px;
    line-height: 1;
}
.wakacart-cart.wakacart-cart .woocommerce-message::before{ color: #7FB800; }
.wakacart-cart.wakacart-cart .woocommerce-info::before   { color: var(--wk-blue); }
.wakacart-cart.wakacart-cart .woocommerce-error::before  { color: var(--wk-coral); }

.wakacart-cart.wakacart-cart .woocommerce-message .button,
.wakacart-cart.wakacart-cart .woocommerce-info .button{
    margin-left: auto;
    padding: 8px 16px;
    font-size: 13px;
    font-weight: 600;
    color: var(--wk-blue);
    background: transparent;
    border: 1px solid var(--wk-line);
    border-radius: 8px;
}

/* ---------- shared card look ---------- */

.wakacart-cart.wakacart-cart .e-cart-section{
    background: var(--wk-card);
    border: 1px solid var(--wk-line);
    border-radius: var(--wk-radius);
    padding: 8px 24px 24px;
    margin: 0;
}
.wakacart-cart.wakacart-cart .e-cart-totals{ padding: 24px; }
.wakacart-cart.wakacart-cart .coupon{ padding: 16px; }

/* ---------- product table -> grid, columns reordered ---------- */

.wakacart-cart.wakacart-cart .e-shop-table table.cart,
.wakacart-cart.wakacart-cart .e-shop-table thead,
.wakacart-cart.wakacart-cart .e-shop-table tbody{
    display: block;
    width: 100%;
    border: 0;
    margin: 0;
}
.wakacart-cart.wakacart-cart .e-shop-table thead tr,
.wakacart-cart.wakacart-cart .e-shop-table tr.cart_item{
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr) 120px 96px 96px 24px;
    align-items: center;
    gap: 16px;
    padding: 20px 0;
    border-bottom: 1px solid var(--wk-line);
}
.wakacart-cart.wakacart-cart .e-shop-table thead tr{ padding: 16px 0; }
/* Every cell is pinned to row 1 of its own row-grid. Without this, grid
   auto-placement walks forward only: `.product-remove` is first in the DOM but
   asks for the last column, so every later cell that asks for an earlier
   column gets pushed onto a new line - which is what broke the layout. */
.wakacart-cart.wakacart-cart .e-shop-table thead tr th,
.wakacart-cart.wakacart-cart .e-shop-table tr.cart_item td{
    grid-row: 1;
}
/* `table.cart` and the section element are both needed here: the widget's own
   reset is `.elementor-widget-woocommerce-cart .woocommerce table.cart td`
   (0,3,2), which outranks a shorter .elementor-kit-21 even after the class doubling. */
.wakacart-cart.wakacart-cart .e-shop-table table.cart thead th,
.wakacart-cart.wakacart-cart .e-shop-table table.cart tbody td{
    border: 0;
    padding: 0;
    background: none;
    vertical-align: middle;
}
/* WooCommerce's responsive-table CSS injects a `data-title` label in front of
   every cell below 768px; this layout supplies its own structure instead. */
.wakacart-cart.wakacart-cart .e-shop-table td::before,
.wakacart-cart.wakacart-cart .e-shop-table th::before{
    content: none !important;
    display: none !important;
}

.wakacart-cart.wakacart-cart .e-shop-table .product-thumbnail{ grid-column: 1; }
.wakacart-cart.wakacart-cart .e-shop-table .product-name     { grid-column: 2; }
.wakacart-cart.wakacart-cart .e-shop-table .product-quantity { grid-column: 3; justify-self: center; }
.wakacart-cart.wakacart-cart .e-shop-table .product-price    { grid-column: 4; text-align: right; }
.wakacart-cart.wakacart-cart .e-shop-table .product-subtotal { grid-column: 5; text-align: right; }
.wakacart-cart.wakacart-cart .e-shop-table .product-remove   { grid-column: 6; text-align: right; }

/* header row */
.wakacart-cart.wakacart-cart .e-shop-table thead th{
    font-size: 13px;
    font-weight: 600;
    color: var(--wk-muted);
    text-align: inherit;
}
.wakacart-cart.wakacart-cart .e-shop-table thead .product-quantity{ text-align: center; }
.wakacart-cart.wakacart-cart .e-shop-table thead .product-price,
.wakacart-cart.wakacart-cart .e-shop-table thead .product-subtotal{ text-align: right; }
/* the design labels the last column "Total", WooCommerce calls it Subtotal */
.wakacart-cart.wakacart-cart .e-shop-table thead .product-subtotal{ font-size: 0; }
.wakacart-cart.wakacart-cart .e-shop-table thead .product-subtotal::after{
    content: "Total";
    font-size: 13px;
}

/* thumbnail.
   WooCommerce ships `.woocommerce img { max-width: 100% }`, and the <a> that
   wraps the thumbnail is inline, so it shrink-wraps to the image's intrinsic
   ratio and then caps the image at that width. Giving the anchor a fixed box
   and clearing max-width is what actually makes the 96px square stick. */
.wakacart-cart.wakacart-cart .e-shop-table .product-thumbnail{
    /* the whitespace either side of the <a> in the template would otherwise
       add two stray line boxes and make the row ~40px taller than the image */
    line-height: 0;
    font-size: 0;
}
.wakacart-cart.wakacart-cart .e-shop-table .product-thumbnail a{
    display: block;
    width: 96px;
    height: 96px;
}
.wakacart-cart.wakacart-cart .e-shop-table .product-thumbnail img{
    display: block;
    width: 96px !important;
    height: 96px !important;
    max-width: none !important;
    object-fit: cover;
    border-radius: 12px;
}

/* name + variation */
.wakacart-cart.wakacart-cart .e-shop-table .product-name a{
    color: var(--wk-ink);
    font-weight: 600;
    font-size: 16px;
    line-height: 1.35;
    text-decoration: none;
}
.wakacart-cart.wakacart-cart .e-shop-table .product-name a:hover{ color: var(--wk-coral); }
.wakacart-cart.wakacart-cart .e-shop-table .product-name .variation,
.wakacart-cart.wakacart-cart .e-shop-table .product-name dl.variation{
    margin: 4px 0 0;
    font-size: 13px;
    color: var(--wk-muted);
}
.wakacart-cart.wakacart-cart .e-shop-table .product-name .variation dt,
.wakacart-cart.wakacart-cart .e-shop-table .product-name .variation dd{
    display: inline;
    margin: 0;
    font-weight: 400;
}

/* quantity field styled as a pill */
.wakacart-cart.wakacart-cart .e-shop-table .quantity{ margin: 0; }
/* quantity stepper: the pill is the .quantity wrapper, and the - / + buttons
   inside it are injected by the helper script. */
.wakacart-cart.wakacart-cart .e-shop-table .quantity{
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    width: 116px;
    padding: 3px;
    background: var(--wk-card);
    border: 1px solid var(--wk-line);
    border-radius: 999px;
}
/* The cart widget pins the quantity field to a 28px box through its own
   height/min-height/max-height trio, so all three have to be reset here. */
.wakacart-cart.wakacart-cart .e-shop-table .quantity .qty{
    width: 42px !important;
    min-width: 0;
    height: 34px !important;
    min-height: 34px !important;
    max-height: none !important;
    padding: 0;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    color: var(--wk-ink);
    background: transparent !important;
    border: 0 !important;
    border-radius: 0;
    -moz-appearance: textfield;
}
.wakacart-cart.wakacart-cart .e-shop-table .quantity .qty::-webkit-outer-spin-button,
.wakacart-cart.wakacart-cart .e-shop-table .quantity .qty::-webkit-inner-spin-button{
    -webkit-appearance: none;
    margin: 0;
}
.wakacart-cart.wakacart-cart .e-shop-table .quantity .wk-qty-btn{
    flex: 0 0 auto;
    width: 30px;
    height: 30px;
    padding: 0;
    font-size: 17px;
    font-weight: 600;
    line-height: 1;
    color: var(--wk-blue);
    background: transparent;
    border: 0;
    border-radius: 50%;
    cursor: pointer;
    transition: background-color .15s ease, color .15s ease;
}
.wakacart-cart.wakacart-cart .e-shop-table .quantity .wk-qty-btn:hover{
    color: #fff;
    background: var(--wk-blue);
}

/* price / total */
.wakacart-cart.wakacart-cart .e-shop-table .product-price,
.wakacart-cart.wakacart-cart .e-shop-table .product-subtotal{
    font-size: 15px;
    color: var(--wk-ink);
    white-space: nowrap;
}
.wakacart-cart.wakacart-cart .e-shop-table .product-subtotal{ font-weight: 700; }

/* remove "x" */
.wakacart-cart.wakacart-cart .e-shop-table td.product-remove a.remove{
    width: 24px;
    height: 24px;
    line-height: 22px;
    font-size: 20px;
    color: var(--wk-muted) !important;
    background: none !important;
    border-radius: 50%;
    transition: color .15s ease, background-color .15s ease;
}
.wakacart-cart.wakacart-cart .e-shop-table td.product-remove a.remove:hover{
    color: #fff !important;
    background: var(--wk-coral) !important;
}

/* Update Cart row */
.wakacart-cart.wakacart-cart .e-shop-table tr:has(td.actions){ border-bottom: 0; }
.wakacart-cart.wakacart-cart .e-shop-table td.actions{
    grid-column: 1 / -1;
    display: flex;
    justify-content: flex-end;
    padding-top: 4px;
}
.wakacart-cart.wakacart-cart .e-shop-table td.actions button[name="update_cart"]{
    padding: 11px 24px;
    font-size: 14px;
    font-weight: 600;
    color: var(--wk-blue);
    background: transparent;
    border: 1px solid var(--wk-blue);
    border-radius: 10px;
}
.wakacart-cart.wakacart-cart .e-shop-table td.actions button[name="update_cart"]:disabled{
    opacity: .45;
    cursor: not-allowed;
}

/* ---------- order summary ---------- */

.wakacart-cart.wakacart-cart .e-cart-totals h2{
    margin: 0 0 18px;
    font-size: 20px;
    font-weight: 700;
    color: var(--wk-ink);
}
.wakacart-cart.wakacart-cart .e-cart-totals table{
    width: 100%;
    margin: 0;
    border: 0;
}
.wakacart-cart.wakacart-cart .e-cart-totals table tr{ border: 0; }
.wakacart-cart.wakacart-cart .e-cart-totals .cart_totals table tbody th,
.wakacart-cart.wakacart-cart .e-cart-totals .cart_totals table tbody td{
    padding: 10px 0;
    border: 0;
    background: none;
    vertical-align: top;
}
.wakacart-cart.wakacart-cart .e-cart-totals table th{
    font-size: 14px;
    font-weight: 500;
    color: var(--wk-muted);
    text-align: left;
    white-space: nowrap;
}
.wakacart-cart.wakacart-cart .e-cart-totals table td{
    font-size: 14px;
    color: var(--wk-ink);
    text-align: right;
}
/* discount reads as a deduction */
.wakacart-cart.wakacart-cart .e-cart-totals tr.cart-discount td,
.wakacart-cart.wakacart-cart .e-cart-totals tr.cart-discount td .amount{
    color: var(--wk-sale);
    font-weight: 600;
}
/* dashed rule above the grand total, as in the design */
.wakacart-cart.wakacart-cart .e-cart-totals tr.order-total th,
.wakacart-cart.wakacart-cart .e-cart-totals tr.order-total td{
    padding-top: 18px;
    border-top: 1px dashed var(--wk-coral);
    font-size: 20px;
    font-weight: 700;
    color: var(--wk-ink);
}
.wakacart-cart.wakacart-cart .e-cart-totals tr.order-total td strong .amount{ font-size: 20px; font-weight: 700; }

/* the "(incl. VAT)" note belongs on its own line under the amount, at half the
   size of the total it annotates */
.wakacart-cart.wakacart-cart .e-cart-totals tr.order-total td small.includes_tax{
    display: block;
    margin-top: 4px;
    font-size: 10px;
    font-weight: 400;
    line-height: 1.5;
    color: var(--wk-muted);
}
.wakacart-cart.wakacart-cart .e-cart-totals tr.order-total td small.includes_tax .amount{
    font-size: inherit;
    font-weight: 400;
    color: inherit;
}

/* Shipping options read as a list, not as a value: the row is broken onto two
   lines so "Shipment" sits above its choices and everything lines up on the
   left edge of the card instead of being pushed right like an amount. */
.wakacart-cart.wakacart-cart .e-cart-totals .cart_totals table tbody tr.woocommerce-shipping-totals th,
.wakacart-cart.wakacart-cart .e-cart-totals .cart_totals table tbody tr.woocommerce-shipping-totals td{
    display: block;
    width: 100%;
    text-align: left;
}
.wakacart-cart.wakacart-cart .e-cart-totals tr.woocommerce-shipping-totals th{ padding-bottom: 2px; }
.wakacart-cart.wakacart-cart .e-cart-totals tr.woocommerce-shipping-totals td{ padding-top: 0; }

.wakacart-cart.wakacart-cart .e-cart-totals ul#shipping_method{ margin: 0; padding: 0; list-style: none; }
/* the first option comes out as a zero-width box without an explicit width,
   which pushes its label off to the right edge of the card */
.wakacart-cart.wakacart-cart .e-cart-totals ul#shipping_method li{
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100% !important;
    margin: 0 0 6px;
    text-align: left;
}
.wakacart-cart.wakacart-cart .e-cart-totals ul#shipping_method li input[type="radio"]{
    flex: 0 0 auto;
    margin: 0;
}
.wakacart-cart.wakacart-cart .e-cart-totals ul#shipping_method label{
    font-size: 13px;
    color: var(--wk-ink);
    cursor: pointer;
}
.wakacart-cart.wakacart-cart .e-cart-totals .woocommerce-shipping-destination,
.wakacart-cart.wakacart-cart .e-cart-totals .shipping-calculator-button{
    display: block;
    font-size: 12px;
    color: var(--wk-muted);
    text-align: left;
}

/* proceed to checkout */
.wakacart-cart.wakacart-cart .wc-proceed-to-checkout{ padding: 18px 0 0; }
.wakacart-cart.wakacart-cart .wc-proceed-to-checkout a.checkout-button{
    display: block;
    width: 100%;
    margin: 0;
    padding: 15px 20px;
    font-size: 15px;
    font-weight: 700;
    text-align: center;
    color: #fff;
    background: var(--wk-blue);
    border: 0;
    border-radius: 12px;
    box-shadow: 0 6px 14px rgba(61, 111, 176, .22);
    transition: background-color .15s ease, transform .15s ease;
}
.wakacart-cart.wakacart-cart .wc-proceed-to-checkout a.checkout-button:hover{
    background: #35619B;
    transform: translateY(-1px);
}

/* ---------- coupon / promo code ---------- */

/* Once the script has reparented them, the coupon box and the badges are
   ordinary blocks inside the sidebar rather than page-grid items, so their
   spacing comes from margins instead of the grid gap. */
.wakacart-cart.wakacart-cart .e-cart__column-end .coupon{ margin-top: 16px; }
.wakacart-cart.wakacart-cart .e-cart__column-end .wakacart-aside{ margin-top: 12px; }

.wakacart-cart.wakacart-cart .coupon .coupon-col{
    display: flex;
    gap: 8px;
    margin: 0;
}
.wakacart-cart.wakacart-cart .coupon .coupon-col-start{ flex: 1 1 auto; min-width: 0; }
.wakacart-cart.wakacart-cart .coupon .coupon-col-end  { flex: 0 0 auto; }
.wakacart-cart.wakacart-cart .coupon input.input-text{
    width: 100%;
    height: 44px;
    padding: 0 14px;
    font-size: 14px;
    color: var(--wk-ink);
    background: var(--wk-card);
    border: 1px solid var(--wk-line);
    border-radius: 10px;
}
.wakacart-cart.wakacart-cart .coupon input.input-text::placeholder{ color: var(--wk-muted); }
.wakacart-cart.wakacart-cart .coupon button.e-apply-coupon{
    height: 44px;
    padding: 0 22px;
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    background: var(--wk-blue);
    border: 0;
    border-radius: 10px;
}
.wakacart-cart.wakacart-cart .coupon button.e-apply-coupon:hover{ background: #35619B; }

/* ---------- extra buttons ---------- */

.wakacart-continue.wakacart-continue .elementor-button{
    padding: 12px 22px;
    font-size: 14px;
    font-weight: 600;
    color: var(--wk-blue);
    background: transparent;
    border: 1px solid var(--wk-blue);
    border-radius: 10px;
}
.wakacart-continue.wakacart-continue .elementor-button:hover{ background: rgba(61,111,176,.07); }

.wakacart-shopmore.wakacart-shopmore .elementor-button{
    display: block;
    width: 100%;
    padding: 15px 20px;
    font-size: 15px;
    font-weight: 700;
    text-align: center;
    color: #fff;
    background: var(--wk-coral);
    border: 0;
    border-radius: 12px;
    box-shadow: 0 6px 14px rgba(241, 112, 107, .25);
}
.wakacart-shopmore.wakacart-shopmore .elementor-button:hover{ background: #E85F5A; }

/* ---------- trust badges ---------- */

.wakacart-aside.e-con{
    gap: 0;
    padding: 0;
}
.wakacart-aside.wakacart-aside .elementor-widget-icon-box{
    padding: 14px 16px;
    background: var(--wk-card);
    border: 1px solid var(--wk-line);
}
.wakacart-aside.wakacart-aside .elementor-widget-icon-box:nth-of-type(2){
    border-radius: var(--wk-radius) var(--wk-radius) 0 0;
    margin-top: 12px;
}
.wakacart-aside.wakacart-aside .elementor-widget-icon-box + .elementor-widget-icon-box{ border-top: 0; }
.wakacart-aside.wakacart-aside .elementor-widget-icon-box:last-child{
    border-radius: 0 0 var(--wk-radius) var(--wk-radius);
}
.wakacart-aside.wakacart-aside .elementor-icon-box-wrapper{
    display: flex;
    align-items: center;
    gap: 12px;
    text-align: left;
}
.wakacart-aside.wakacart-aside .elementor-icon-box-icon{ margin: 0; flex: 0 0 auto; }
.wakacart-aside.wakacart-aside .elementor-icon{
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    font-size: 17px;
    border-radius: 50%;
}
.wakacart-badge--secure.wakacart-badge--secure .elementor-icon{ color: var(--wk-blue);  background: rgba(61,111,176,.12); }
.wakacart-badge--returns.wakacart-badge--returns .elementor-icon{ color: var(--wk-coral); background: rgba(241,112,107,.14); }
.wakacart-badge--gift.wakacart-badge--gift .elementor-icon{ color: #E0A106;         background: rgba(255,195,19,.18); }
.wakacart-aside.wakacart-aside .elementor-icon-box-title{
    margin: 0;
    font-size: 15px;
    font-weight: 700;
    color: var(--wk-ink);
}
.wakacart-aside.wakacart-aside .elementor-icon-box-description{
    margin: 2px 0 0;
    font-size: 12.5px;
    color: var(--wk-muted);
}

/* ---------- responsive ---------- */

@media (max-width: 1024px){
    .wakacart-cart.wakacart-cart .e-cart__container{ grid-template-columns: minmax(0, 1fr); }
    .wakacart-cart.wakacart-cart .e-cart__column-end{ margin-top: var(--wk-gap); }
}

/* Below 768px WooCommerce's own responsive-table rules take over the cells
   (display:block, text-align:right). The placements here carry an extra class
   so they outrank both those rules and the `grid-row: 1` pinning above. */
@media (max-width: 767px){
    .wakacart-cart.wakacart-cart .e-shop-table thead{ display: none; }
    .wakacart-cart.wakacart-cart .e-shop-table tr.cart_item{
        grid-template-columns: 72px minmax(0, 1fr) 24px;
        grid-template-areas:
            "thumb name  remove"
            "thumb price price"
            "qty   total total";
        gap: 10px 12px;
        padding: 16px 0;
    }
    .wakacart-cart.wakacart-cart .e-shop-table tr.cart_item td.product-thumbnail{ grid-area: thumb; }
    .wakacart-cart.wakacart-cart .e-shop-table tr.cart_item td.product-name     { grid-area: name;  text-align: left; }
    .wakacart-cart.wakacart-cart .e-shop-table tr.cart_item td.product-remove   { grid-area: remove; text-align: right; }
    .wakacart-cart.wakacart-cart .e-shop-table tr.cart_item td.product-price    { grid-area: price; text-align: left; }
    .wakacart-cart.wakacart-cart .e-shop-table tr.cart_item td.product-quantity { grid-area: qty; justify-self: start; }
    .wakacart-cart.wakacart-cart .e-shop-table tr.cart_item td.product-subtotal { grid-area: total; text-align: right; align-self: center; }
    .wakacart-cart.wakacart-cart .e-shop-table tr.cart_item td{ display: block; }
    .wakacart-cart.wakacart-cart .e-shop-table .product-thumbnail a,
    .wakacart-cart.wakacart-cart .e-shop-table .product-thumbnail img{ width: 72px !important; height: 72px !important; }
    .wakacart-cart.wakacart-cart .e-cart-section{ padding: 8px 16px 16px; }
    .wakacart-cart.wakacart-cart .e-cart-totals{ padding: 18px; }
}/* End custom CSS */