/* Add to cart contract page button colour */
.addcartqueue {
  background: #ffd344 !important;
}

/* Hide Add to cart*/
body.ex-contractitems .pp-add-btn {
  display: none !important;
}

:root {
  --evo-brand-secondary: #ffd344;
  --evo-brand-accent: #DBD6E9;
  --evo-header-background: #fff;
  --pdp-bg:#f7f8fb; --pdp-card:#fff; --pdp-muted:#6b7280; --pdp-ink:#111827;
  --pdp-brand:#6d28d9; --pdp-brand-700:#5b21b6; --pdp-line:#eef0f5;
  --pdp-radius-lg:16px; --pdp-radius-md:12px; --pdp-shadow:0 10px 24px rgba(0,0,0,.06);
  --ppc-bg:#0b0f19; --ppc-surface:#121829; --ppc-elev:#1b2440; --ppc-text:#e7ecf3; --ppc-sub:#a7b0c0;
  --ppc-accent:#5b8cff; --ppc-accent-press:#3c6cf4; --ppc-user:#2a8858; --ppc-border:#2a3553; --ppc-success:#3ccf91;
  --ppc-radius:16px; --ppc-shadow:0 8px 24px rgba(0,0,0,.35), 0 2px 8px rgba(0,0,0,.25);
}

.btn-primary {
  background: #ffc711;
}



.cart-resume .promotion_discount {
 display: none !important; 
}

.hide {
 display: none; 
}

.cartclear_container .btn, .shopping-cart .cart-topbuttons .btn-primary {
background: #ccc !important;
}

.shopping-cart .cart-topbuttons .to-checkout, .carttotals_container .to-checkout {
background: #ffc711 !important; 
}

/* ------------------------------------------------------- */
/* PRODUCT TILE IMAGE AREA — MATCHING web (220px)        */
/* ------------------------------------------------------- */

.product-tile-image,
.product-tile-image .text-center,
.imgthumbnail {
    background-color: #f7f7f7 !important;
    border-radius: 12px !important;
    padding: 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    position: relative !important;
    height: 220px !important;
    min-height: 220px !important;
}

.product-tile-image .text-center,
.imgthumbnail .thumb-align {
    background: transparent !important;
    box-shadow: none !important;
}

.product-tile-image img,
.imgthumbnail img {
    height: 100% !important;
    width: auto !important;
    max-height: 100% !important;
    max-width: none !important;
    object-fit: contain !important;
    mix-blend-mode: multiply !important;
    background: transparent !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 0.98;
}

/* ------------------------------------------------------- */
/* HOVER PREVIEW POPUP — 20% BIGGER                        */
/* ------------------------------------------------------- */

.image-hover-preview {
    position: absolute;
    z-index: 9999;
    width: 444px !important;         /* was 370px */
    padding: 14px !important;
    background: #fff;
    border-radius: 12px;
    border: 1px solid rgba(0,0,0,0.12);
    box-shadow: 0 20px 40px rgba(0,0,0,0.18), 0 8px 20px rgba(0,0,0,0.12);
    display: none;
    opacity: 0;
    transform: translateX(10px) scale(0.96);
    transition: opacity 0.18s ease-out, transform 0.18s ease-out;
    pointer-events: none !important;
}

.image-hover-preview.active {
    display: block;
    opacity: 1;
    transform: translateX(0) scale(1);
}

.image-hover-preview img {
    width: 100% !important;
    max-height: 312px !important;   /* was 260px */
    object-fit: contain !important;
    transition: transform 0.25s ease-out;
}

.image-hover-preview:hover img {
    transform: scale(1.15);
}

@media (max-width: 900px) {
    .image-hover-preview {
        display: none !important;
        visibility: hidden !important;
    }
}

/* PACK BADGE IN PREVIEW */
.image-hover-packbadge {
    position: absolute;
    bottom: 18px;
    right: 18px;
    background: #f6f7ff;
    color: #4338ca;
    border: 1px solid rgba(67,56,202,.14);
    padding: 6px 14px;
    font-size: 13px;
    font-weight: 600;
    border-radius: 999px;
    display: none;
    pointer-events: none;
    white-space: nowrap;
}

/* ------------------------------------------------------- */
/* REMOVE OUTER CARD BORDER + CLEAN HOVER                  */
/* ------------------------------------------------------- */

.tileparent,
.tileparent .tile,
.tileparent .footer,
.col-lg-3.col-md-4.col-sm-6,
.row [class*="col-"] .tileparent,
.product-tile,
.product-list-item,
.list-attribute.product-volume,
.list-attribute.product-category {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

.tile {
    border: none !important;
    box-shadow: none !important;
    padding-bottom: 8px !important;
    margin-bottom: 10px !important;
    transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.tile:hover {
    box-shadow: 0 8px 24px rgba(0,0,0,0.09) !important;
    transform: translateY(-3px) !important;
}

/* ------------------------------------------------------- */
/* PRODUCT TITLE (2 LINES MAX)                             */
/* ------------------------------------------------------- */

.product-name {
    font-size: 15px !important;
    line-height: 1.25 !important;
    margin: 4px 0 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    max-height: 2.6em !important;
}

/* ------------------------------------------------------- */
/* TIER PRICING INFO + POPUP                               */
/* ------------------------------------------------------- */

.product-shopping-actions-tierpricing {
    display: none !important;
}

.pp-tier-info {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 10px 0 4px 0;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    color: #333;
    user-select: none;
}

.pp-tier-icon {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 700;
    background: #e7ebff;
    color: #4550e6;
    border: 1px solid #cdd3ff;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Popup container */
.pp-tier-popup {
    position: absolute;
    z-index: 99999;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 12px;
    padding: 12px 14px;
    min-width: 240px;
    display: none;
    box-shadow: 0 10px 25px rgba(0,0,0,.12);
    opacity: 0;
    transition: opacity 0.12s ease-out;
}

.pp-tier-popup.active {
    display: block;
    opacity: 1;
}

/* Tier pricing header – fix "Price ex VATDisc." */
.pp-tier-header {
    display: grid !important;
    grid-template-columns: 1fr 1fr 1fr !important; /* Qty | Price ex VAT | Disc. */
    column-gap: 8px;
    font-size: 13px;
    font-weight: 700;
    padding-bottom: 6px;
    border-bottom: 1px solid #eee;
    margin-bottom: 6px;
}

/* Keep each label on its own word */
.pp-tier-header span {
    white-space: nowrap;
}

/* Optional: alignment (center price, right-align discount) */
.pp-tier-header span:nth-child(2) {
    text-align: center;
}
.pp-tier-header span:nth-child(3) {
    text-align: right;
}
/* Lines */
.pp-tier-line {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    padding: 6px 4px;
    font-size: 14px;
    cursor: pointer;
    border-radius: 6px;
    align-items: center;
}

.pp-tier-line:hover {
    background: #f4f6ff;
}

/* Price column centered */
.pp-tier-line span:nth-child(2) {
    text-align: center;
}

/* Discount column */
.pp-tier-disc {
    text-align: right;
    color: #d40000;
    font-weight: 600;
}
.pp-tier-info {
    background: #f3f0ff;
    padding: 6px 10px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    color: #4a34d7;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 10px 0 6px 0;
    cursor: pointer;
    border: 1px solid #dcd6ff;
}

.pp-tier-info:hover {
    background: #e7e2ff;
}

.pp-tier-icon {
    background: #dcd6ff;
    border: 1px solid #c4baff;
    color: #3b2fc4;
}
.image-hover-description {
    margin-top: 10px;
    font-size: 13px;
    line-height: 1.35;
    color: #333;
    max-width: 100%;
    opacity: 0.9;
}
/* ===========================================================
   SHARED PRODUCT GRID (Contract Items + Frequently Purchased)
   =========================================================== */

body.ex-contractitems #list,
body.ex-frequentlypurchased #list {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 24px !important;
}

body.ex-contractitems .product-row,
body.ex-frequentlypurchased .product-row {
    flex: 0 0 calc(25% - 24px) !important;
    max-width: calc(25% - 24px) !important;
    background: #fff !important;
    border-radius: 12px !important;
    padding: 16px !important;
    box-shadow: 0 4px 14px rgba(0,0,0,0.10) !important;
    display: flex !important;
    flex-direction: column !important;
    text-align: left !important;
    float: none !important;
    margin: 0 !important;
}

body.ex-contractitems .product-row:hover,
body.ex-frequentlypurchased .product-row:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(0,0,0,0.12) !important;
}

/* Reset EVO inner grid */
body.ex-contractitems .product-row [class*="col-"],
body.ex-frequentlypurchased .product-row [class*="col-"],
body.ex-contractitems .margin-list,
body.ex-frequentlypurchased .margin-list,
body.ex-contractitems .itemcontent,
body.ex-frequentlypurchased .itemcontent,
body.ex-contractitems .imagecontent,
body.ex-frequentlypurchased .imagecontent,
body.ex-contractitems .productcontent,
body.ex-frequentlypurchased .productcontent,
body.ex-contractitems .pricecontent,
body.ex-frequentlypurchased .pricecontent {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    display: block !important;
    clear: both !important;
}

/* Image Box */
body.ex-contractitems .imgthumbnail,
body.ex-frequentlypurchased .imgthumbnail {
    background: #f7f7f7 !important;
    border-radius: 12px !important;
    height: 220px !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    overflow: hidden !important;
    margin-bottom: 12px !important;
}

body.ex-contractitems .imgthumbnail img,
body.ex-frequentlypurchased .imgthumbnail img {
    mix-blend-mode: normal !important;
    width: auto !important;
    max-width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
}

/* Brand logo */
body.ex-contractitems .brand-label,
body.ex-frequentlypurchased .brand-label {
    height: 28px !important;
    display: flex !important;
    align-items: center !important;
    margin-bottom: 6px !important;
}

body.ex-contractitems .brand-label img,
body.ex-frequentlypurchased .brand-label img {
    max-height: 24px !important;
    width: auto !important;
}

/* Product Name */
body.ex-contractitems .product-name a,
body.ex-frequentlypurchased .product-name a {
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    margin-bottom: 6px !important;
}

/* SKU + Cat */
body.ex-contractitems .product-sku,
body.ex-frequentlypurchased .product-sku,
body.ex-contractitems .product-category,
body.ex-frequentlypurchased .product-category {
    margin-bottom: 6px !important;
}

/* Stock */
body.ex-contractitems .live-inventory-v2-wrapper,
body.ex-frequentlypurchased .live-inventory-v2-wrapper {
    margin: 6px 0 10px !important;
}

/* Bottom row (qty + add) */
body.ex-contractitems .pp-actions-row,
body.ex-frequentlypurchased .pp-actions-row {
    margin-top: auto !important;
    display: flex;
    gap: 10px;
    align-items: center;
}

body.ex-contractitems .qty-list,
body.ex-frequentlypurchased .qty-list {
    width: 60px !important;
    height: 38px !important;
    border: 1px solid #ccc !important;
    border-radius: 6px !important;
    text-align: center !important;
}

body.ex-contractitems .pp-add-btn,
body.ex-frequentlypurchased .pp-add-btn {
    flex: 1;
    background: #ffc711 !important;
    border: none;
    border-radius: 8px;
    padding: 10px;
    font-weight: 600;
    cursor: pointer;
}

body.ex-contractitems .pp-add-btn:hover,
body.ex-frequentlypurchased .pp-add-btn:hover {
    background: #f0b800 !important;
}

/* Responsive */
@media (max-width: 1200px) {
    body.ex-contractitems .product-row,
    body.ex-frequentlypurchased .product-row {
        flex: 0 0 calc(33.333% - 24px) !important;
    }
}

@media (max-width: 900px) {
    body.ex-contractitems .product-row,
    body.ex-frequentlypurchased .product-row {
        flex: 0 0 calc(50% - 24px) !important;
    }
}

@media (max-width: 600px) {
    body.ex-contractitems .product-row,
    body.ex-frequentlypurchased .product-row {
        flex: 0 0 100% !important;
    }
}
/* ===========================================================
   SHARED PAGE HEADER (H1 + Button Bar)
   =========================================================== */

/* Centered H1 for all pages */
.pp-page-title {
    font-size: 28px;
    text-align: center;
    font-weight: 700;
    margin-bottom: 15px;
    margin-top: 10px;
}

/* Button wrapper */
.pp-top-buttons {
    width: 100%;
    display: flex;
    justify-content: center;
    gap: 12px;
    margin: 0 0 25px 0;
}

/* Default button style */
.pp-top-buttons a {
    display: inline-flex;
    align-items: center;
    padding: 8px 18px;
    background: #f5f0ff;
    border: 1px solid #d4c7ff;
    color: #4b00b7 !important;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none !important;
    transition: 0.15s ease;
}

/* Hover */
.pp-top-buttons a:hover {
    background: #ebe2ff;
    border-color: #c5b3ff;
}

/* Active page button */
.pp-top-buttons a.active-button {
    background: #4b00b7 !important;
    color: #fff !important;
    border-color: #4b00b7 !important;
}
/* ------------------------------------------------------------
   SEARCH BAR — CENTERED + CLEAN
------------------------------------------------------------- */

.pp-searchwithin-wrapper {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 20px !important;
    margin-bottom: 5px !important;
}

.pp-searchwithin-wrapper .clean-search {
    width: 100%;
    max-width: 560px;
}

/* Remove Evo borders */
.pp-searchwithin-wrapper .searchtable,
.pp-searchwithin-wrapper .select2-container,
.pp-searchwithin-wrapper .select2-choices {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* Search input */
.pp-searchwithin-wrapper input.searchlistwithin_hd {
    width: 100% !important;
    height: 50px !important;
    border-radius: 22px !important;
    border: 1px solid #d7d2ff !important;
    padding: 0 18px 0 40px !important;
    background: #ffffff !important;
    font-size: 14px !important;
    color: #333 !important;
    transition: 0.2s ease;
}

.pp-searchwithin-wrapper input.searchlistwithin_hd::placeholder {
    color: #777 !important;
}

.pp-searchwithin-wrapper input.searchlistwithin_hd:focus {
    border-color: #7e6bff !important;
    box-shadow: 0 0 0 3px rgba(126,107,255,0.20);
}

/* Search icon */
.pp-searchwithin-wrapper .relsearch {
    position: relative !important;
}

.pp-searchwithin-wrapper button[type="submit"] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    border: none !important;
    background: none !important;
    color: #6748ff !important;
    font-size: 16px !important;
    cursor: pointer;
}

/* ------------------------------------------------------------
   RESET FILTERS — CENTERED LIGHT RED BUTTON
------------------------------------------------------------- */

.pp-reset-wrapper {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 8px !important;
    margin-bottom: 15px !important;
}

.pp-reset-button {
    background: #ffecec !important;
    border: 1px solid #ffbcbc !important;
    color: #b30000 !important;
    padding: 7px 18px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    border-radius: 20px !important;
    cursor: pointer !important;
    display: inline-block !important;
    text-decoration: none !important;
    transition: 0.2s ease;
}

.pp-reset-button:hover {
    background: #ffd9d9 !important;
    border-color: #ffa8a8 !important;
}
/* NEW: True centering wrapper */

.pp-search-center {
  width: 100%;
}

.pp-search-center section.search .search-form button[type=submit] {
  left:500px !important;
  top: 50% !important;
  width:60px;
  height: 50px;
  border: 1px solid var(--evo-brand-accent, #e6effb) !important;
  border-top-right-radius: 22px;
  border-bottom-right-radius: 22px; 
}

.pp-search-center i {
  display: block !important;
}
.pp-search-center section.search  {
    display: flex !important;
    justify-content: center;
    width: 100%;
}
body.ex-contractitems .remove-filter,
body.ex-frequentlypurchased .searchtoolsright {
    display: none !important;
}