/*
 * P-Clips — slide-out mini-cart styles
 * Extracted from modules/woocommerce/slide-out-mini-cart/mini-cart-all-edits.php
 * (Phase 3.1d, 21 Jul 2026). Registered on the original 'custom-menu-cart-style' handle
 * so it keeps its place in the queue. 96% of these declarations carry !important.
 */
/* =========================================
   MINI CART SCOPED STYLES
   Scope: .elementor-menu-cart__main
   ========================================= */

.elementor-menu-cart__main,
.elementor-menu-cart__main * {
    font-family: "Figtree", Sans-serif;
    box-sizing: border-box;
}

/* Hide Elementor's old pseudo header so we don't get duplicates */
.elementor-menu-cart__main::before {
    content: "" !important;
    display: none !important;
}

/* =========================================
   HEADER (JS injected)
   Basket title left, Close button right
   ========================================= */

.elementor-menu-cart__main .pclips-mini-cart-header {
    padding: 18px 0px 12px !important;
    border-bottom: 1px solid rgba(5, 22, 51, 0.10) !important;
    margin-bottom: 6px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
}

.elementor-menu-cart__main .pclips-mini-cart-header__title {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 1.15rem !important;
    font-weight: 800 !important;
    color: #051633 !important;
    line-height: 1.2 !important;
}

.elementor-menu-cart__main .pclips-mini-cart-header__actions {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
}

/* =========================================
   CLOSE BUTTON (stabilised)
   ========================================= */

.elementor-menu-cart__main .pclips-mini-cart-header__actions .elementor-menu-cart__close-button {
    position: static !important;
    inset: auto !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    bottom: auto !important;
    margin: 0px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 38px !important;
    height: 38px !important;
    border-radius: 12px !important;

    cursor: pointer !important;
    transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.08s ease !important;

    overflow: hidden !important;
}

/* Draw our own X icon inside the close button */
.elementor-menu-cart__main .pclips-mini-cart-header__actions .elementor-menu-cart__close-button {
    position: relative !important;
}

/* Hide any Elementor-provided icon inside */
.elementor-menu-cart__main .pclips-mini-cart-header__actions .elementor-menu-cart__close-button i,
.elementor-menu-cart__main .pclips-mini-cart-header__actions .elementor-menu-cart__close-button svg {
    display: none !important;
}

.elementor-menu-cart__main .pclips-mini-cart-header__actions .elementor-menu-cart__close-button::before,
.elementor-menu-cart__main .pclips-mini-cart-header__actions .elementor-menu-cart__close-button::after {
    content: "" !important;
    position: absolute !important;
    width: 18px !important;
    height: 3px !important;
    background: rgba(5, 22, 51, 0.92) !important;
    border-radius: 999px !important;
    top: 50% !important;
    left: 50% !important;
    transform-origin: center !important;
}

.elementor-menu-cart__main .pclips-mini-cart-header__actions .elementor-menu-cart__close-button::before {
    transform: translate(-50%, -50%) rotate(45deg) !important;
}

.elementor-menu-cart__main .pclips-mini-cart-header__actions .elementor-menu-cart__close-button::after {
    transform: translate(-50%, -50%) rotate(-45deg) !important;
}

.elementor-menu-cart__main .pclips-mini-cart-header__actions .elementor-menu-cart__close-button:hover {
    background: rgb(255 255 255 / 10%) !important;
    border-color: rgba(5, 22, 51, 0.20) !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.10) !important;
}

.elementor-menu-cart__main .pclips-mini-cart-header__actions .elementor-menu-cart__close-button:focus {
    outline: none !important;
}

.elementor-menu-cart__main .pclips-mini-cart-header__actions .elementor-menu-cart__close-button:focus-visible {
    box-shadow: 0 0 0 3px rgba(11, 87, 208, 0.35), 0 2px 10px rgba(0,0,0,0.10) !important;
}

/* =========================================
   CLEAR BASKET (moved to bottom, above CTA buttons)
   ========================================= */

.elementor-menu-cart__main .pclips-mini-cart-clear-wrap {
    padding: 12px 16px 10px !important;
    background: transparent !important;
}

.elementor-menu-cart__main .pclips-mini-cart-clear__btn {
    display: flex !important;
    width: 100% !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 12px 14px !important;
    border-radius: 14px !important;

    color: #991B1B !important;

    font-weight: 800 !important;
    font-size: 0.95rem !important;
    line-height: 1 !important;

    cursor: pointer !important;
    text-decoration: none !important;
    transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.08s ease, box-shadow 0.2s ease !important;
}

.elementor-menu-cart__main .pclips-mini-cart-clear__btn:active {
    transform: scale(0.99) !important;
}

.elementor-menu-cart__main .pclips-mini-cart-clear__btn[aria-busy="true"] {
    opacity: 0.75 !important;
    cursor: progress !important;
}

/* =========================================
   ITEM LAYOUT + SKU + STOCK PILLS
   ========================================= */

.elementor-menu-cart__main .elementor-menu-cart__product.woocommerce-cart-form__cart-item.cart_item {
    display: grid !important;
    grid-template-columns: 64px 1fr !important;
    grid-auto-rows: min-content !important;
    column-gap: 14px !important;
    row-gap: 8px !important;
    align-items: start !important;

    /* IMPORTANT: override Elementor's padding-block-end / padding-inline-end */
    padding-block-start: 14px !important;
    padding-block-end: 0 !important;
    padding-inline-start: 15px !important;
    padding-inline-end: 15px !important;

    /* Belt + braces: kill any bottom spacing that can look like "extra rows" */
    margin-block-end: 0 !important;
}

/* Hide Elementor's remove cell (we relocate the link elsewhere) */
.elementor-menu-cart__main .elementor-menu-cart__product-remove.product-remove {
    display: none !important;
}

.elementor-menu-cart__main .elementor-menu-cart__product.pclips-mini-cart-item--removing {
    opacity: 0.55 !important;
    pointer-events: none !important;
    transition: opacity 0.15s ease !important;
}

.elementor-menu-cart__main .elementor-menu-cart__product-image.product-thumbnail {
    grid-column: 1 !important;
    grid-row: 1 / span 4 !important;
    align-self: start !important;
}

.elementor-menu-cart__main .elementor-menu-cart__product-image.product-thumbnail img {
    width: 64px !important;
    height: 64px !important;
    object-fit: contain !important;
    display: block !important;
}

.elementor-menu-cart__main .elementor-menu-cart__product-name.product-name {
    grid-column: 2 !important;
    grid-row: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    min-width: 0 !important;
}

.elementor-menu-cart__main .pclips-mini-cart-sku {
    display: block !important;
    font-size: 0.75rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    color: #6B7280 !important;
    line-height: 1.2 !important;
}

.elementor-menu-cart__main .elementor-menu-cart__product-name.product-name a {
    font-weight: 800 !important;
    font-size: 0.9rem !important;
    line-height: 1.25 !important;
    color: #051633 !important;
    text-decoration: none !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
}


/* Prevent product content from overflowing the mini-cart drawer */
.elementor-menu-cart__main .elementor-menu-cart__product-name.product-name,
.elementor-menu-cart__main .elementor-menu-cart__product-name.product-name *,
.elementor-menu-cart__main .elementor-menu-cart__product-price.product-price {
    max-width: 100% !important;
    min-width: 0 !important;
}


/* =========================================
   PACK SIZE + PRICE: make them IDENTICAL
   ========================================= */

.elementor-menu-cart__main .elementor-menu-cart__product-name.product-name .variation,
.elementor-menu-cart__main .elementor-menu-cart__product-price.product-price,
.elementor-menu-cart__main .elementor-menu-cart__product-price.product-price .quantity,
.elementor-menu-cart__main .elementor-menu-cart__product-price.product-price .quantity * {
    margin: 10px 0px 10px 0px !important;
    padding: 0 !important;
    color: #000 !important;
    font-weight: 500 !important;
    font-size: 0.85rem !important;
    line-height: 1.25 !important;
}

.elementor-menu-cart__main .elementor-menu-cart__product-name.product-name .variation {
    display: block !important;
}

/* Keep dt/dd inline so it reads as one line */
.elementor-menu-cart__main .elementor-menu-cart__product-name.product-name .variation dt,
.elementor-menu-cart__main .elementor-menu-cart__product-name.product-name .variation dd,
.elementor-menu-cart__main .elementor-menu-cart__product-name.product-name .variation dd p {
    display: inline !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #000 !important;
    font-weight: 500 !important;
    font-size: 0.85rem !important;
    line-height: 1.25 !important;
}

/* No auto colon after dt */
.elementor-menu-cart__main .elementor-menu-cart__product-name.product-name .variation dt::after {
    content: "" !important;
}

/* Small spacing between label and value */
.elementor-menu-cart__main .elementor-menu-cart__product-name.product-name .variation dd {
    margin-inline-start: 4px !important;
}

/* Price block positioning stays the same */
.elementor-menu-cart__main .elementor-menu-cart__product-price.product-price {
    grid-column: 2 !important;
    grid-row: 2 !important;

    /* Kill any “mystery vertical space” */
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

.elementor-menu-cart__main .elementor-menu-cart__product-message {
    grid-column: 2 !important;
    grid-row: 3 !important;
    margin: 10px 0px 0px 0px !important;
    padding: 0 !important;
    justify-self: start !important;
    align-self: start !important;
    width: 100% !important;
}

/* If Elementor outputs an empty message wrapper, don't let it create a phantom row */
.elementor-menu-cart__main .elementor-menu-cart__product-message:empty {
    display: none !important;
}

.elementor-menu-cart__main .pclips-mini-stock-pill {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 6px 12px !important;
    border-radius: 8px !important;
    font-size: 0.8rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    border: 1px solid transparent !important;
    white-space: nowrap !important;
    margin-top: 10px !important;
}

.elementor-menu-cart__main .pclips-mini-stock-stack {
    margin-top: 6px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    align-items: flex-start !important;
}

.elementor-menu-cart__main .pclips-mini-stock-stack .pclips-mini-stock-pill {
    margin-top: 0 !important;
}

.elementor-menu-cart__main .pclips-mini-stock-pill--in {
    background: #E6F6EA !important;
    border-color: #D0EBD7 !important;
    color: #1E7A3A !important;
}

.elementor-menu-cart__main .pclips-mini-stock-pill--backorder {
    background: #FFF1E6 !important;
    border-color: #FFE0CC !important;
    color: #B45309 !important;
}

.woocommerce-mini-cart__empty-message {
    margin-top: 15px;
}

/* =========================================
   LINE-ITEM REMOVE: "Remove item" button
   Injected by JS into each product row
   ========================================= */

.elementor-menu-cart__main .pclips-mini-cart-remove-wrap {
    grid-column: 2 !important;
    grid-row: 4 !important;
    margin: 6px 0 16px !important;
    padding: 0 !important;
    justify-self: start !important;
    width: 100% !important;
}

.elementor-menu-cart__main a.pclips-mini-cart-remove-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;

    border-radius: 12px !important;
    color: #000 !important;
    font-weight: 500 !important;
    font-size: 0.75rem !important;
    line-height: 1 !important;
    text-decoration: none !important;
    cursor: pointer !important;

    padding: 6px 0 0 3px !important;
    transition: color 0.2s ease, transform 0.08s ease, box-shadow 0.2s ease !important;
}

.elementor-menu-cart__main a.pclips-mini-cart-remove-btn:hover {
    color: #7F1D1D !important;
    text-decoration: underline !important;
}

.elementor-menu-cart__main a.pclips-mini-cart-remove-btn:active {
    transform: scale(0.99) !important;
}

.elementor-menu-cart__main a.pclips-mini-cart-remove-btn[aria-busy="true"] {
    opacity: 0.75 !important;
    cursor: progress !important;
}

.elementor-menu-cart__main a.pclips-mini-cart-remove-btn:focus-visible {
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(11, 87, 208, 0.35) !important;
}

/* =========================================
   FIX: Keep footer CTAs always visible
   ========================================= */

.elementor-menu-cart__main {
    display: flex !important;
    flex-direction: column !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    overflow: hidden !important;
}

.elementor-menu-cart__main .widget_shopping_cart_content {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

.elementor-menu-cart__main .elementor-menu-cart__footer-buttons {
    flex: 0 0 auto !important;
    padding: 0px!important;
}

.elementor-menu-cart__main .pclips-mini-cart-clear-wrap {
    flex: 0 0 auto !important;
}

.elementor-menu-cart__main .widget_shopping_cart_content {
    padding-bottom: 16px !important;
}

a.elementor-button.elementor-button--view-cart.elementor-size-md {
    background-color: #051633;
    border-radius: 99px !important;
    transition: background-color 0.5s;
}

a.elementor-button.elementor-button--view-cart.elementor-size-md:hover {
    background-color: #08214b;
}

a.elementor-button.elementor-button--checkout.elementor-size-md {
    background-color: #0b57d0;
    border-radius: 99px !important;
    transition: background-color 0.5s;
    font-weight:800!important;
}

a.elementor-button.elementor-button--checkout.elementor-size-md:hover {
    background-color: #1653B4;
}

.elementor-menu-cart__main .elementor-menu-cart__product.woocommerce-cart-form__cart-item.cart_item {
    row-gap: 0px !important;
}










/* =========================================
   MOBILE PADDING FIX (<= 960px)
   - Add consistent side padding so nothing touches edges
   - Keep close button aligned and not clipped
   ========================================= */
@media (max-width: 960px){

  /* Give the whole drawer an inset */
  .elementor-menu-cart__main{
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  /* Header: align to new inset and avoid edge-clipping */
  .elementor-menu-cart__main .pclips-mini-cart-header{
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Product rows: stop double-padding against the new main padding */
  .elementor-menu-cart__main .elementor-menu-cart__product.woocommerce-cart-form__cart-item.cart_item{
    padding-inline-start: 0 !important;
    padding-inline-end: 0 !important;
  }

  /* Clear basket + CTA footer buttons should match inset */
  .elementor-menu-cart__main .pclips-mini-cart-clear-wrap{
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .elementor-menu-cart__main .elementor-menu-cart__footer-buttons{
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}


/* =====================================================
   FORCE MINI CART ABOVE ALL OVERLAYS (MOBILE SAFE)
   ===================================================== */

/* Elementor mini cart wrapper */
.elementor-menu-cart__main {
    position: fixed !important;
    z-index: 999999 !important;
}

/* Mini cart backdrop / overlay */
.elementor-menu-cart__overlay,
.elementor-menu-cart__overlay::before {
    z-index: 999998 !important;
}

/* Ensure drawer container itself is above headers/search */
.elementor-menu-cart__container {
    z-index: 999999 !important;
}


@media (max-width: 1024px){
.elementor-menu-cart__subtotal {
    padding: 30px;
}
}


/* ------------------------------------------------------------------
   SKU line above the mini-cart product title.
   Added Phase 3.1d follow-up: the two PHP filters that were supposed to
   render this never fired (Elementor renders its own mini-cart markup),
   so it is injected by assets/js/mini-cart.js from the data-product_sku
   attribute already present on the remove link.
   Typography deliberately matches the cart page SKU: 12.8px / 700 / muted.
   ------------------------------------------------------------------ */
.elementor-menu-cart__product .elementor-menu-cart__product-name .pclips-mini-cart-sku{
    display:block !important;
    margin:0 0 2px !important;
    font-size:12.8px !important;
    font-weight:700 !important;
    line-height:1.15 !important;
    letter-spacing:.02em !important;
    color:#6b7280 !important;
    text-transform:uppercase !important;
}