/* Cart drawer (#cl-cartside) — non-compiled frontend structural CSS.
   Enqueued via cart/frontend/hooks/wp_enqueue_scripts.php (cl_cart_public_css). */

/* Right-clearance for the drawer's top summary row so its right-aligned "N items"
   count doesn't sit under the floating global close button (.cl-modal-close-x —
   position:absolute; top:0; inset-inline-end:0; 30px, defined in public.css → it
   occupies the top ~30px of the trailing edge). The scroll body already supplies its
   own inset (P2 — guarded to a 10px minimum), so only a small extra nudge is needed.
   Drawer-scoped (#cl-cartside) so the cart PAGE header is unaffected. Logical padding
   (inline-end) flips with RTL, matching the close button's inset-inline-end. */
#cl-cartside .cl_cart_products > .cl_toggle_header {
    padding-inline-end: 8px;
}

/* Coupon feedback message, directly under the coupon field (cart drawer AND checkout summary —
   this file loads wherever the cart controller does, which is also where the coupon block
   renders). coupons.js renderMessage() writes a <div class="cl-error-response|cl-success-response">
   into it: the same classes, and so the same colours, as the floating toast (public.css). Only the
   spacing lives here, because public.css gives those classes colour alone — the toast's padding and
   radius come from .cl-notification, which an inline message does not have.
   Scoped to .cl_cart_coupon so it also outranks the checkout form's unscoped
   `.cl-error-response { padding:10px; font-weight:bold; }` on the checkout page.
   Hidden while empty so the block's column gap adds no blank space under the field. */
.cl_cart_coupon .cl-coupon-message:empty {
    display: none;
}
.cl_cart_coupon .cl-coupon-message > div {
    padding: 8px 12px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
}

/* A price and its currency stay on one line. On a 390px phone a row with the remove "×"
   left the price box so narrow that "693 MAD" broke into "693 / MAD" (G8, 26-09-2026). */
.cart-product-price > div {
    white-space: nowrap;
}
