/* ==========================================================================================================
   Product details page (PDP), UX upgrade 2026-09 (staging). Loaded on product pages only (includes/pdp.php).
   Template: Elementor single-product 25741. Everything is scoped to it, so the gallery plugin's styles in the
   info popup (3732) and the catalog cards are untouched.
   Calm: one brand colour (#DF1A81) for the price and the primary action only; grey quiet lines; 8px rhythm.
   Motion: opacity/transform only, 150-250 ms, none under prefers-reduced-motion.
   ========================================================================================================== */

.elementor-25741 {
    --pdp-pink: #DF1A81;
    --pdp-pink-dark: #C8166F;
    --pdp-pink-text: #A3125A;
    --pdp-pink-soft: #FFF6FA;
    --pdp-ink: #1c1b1f;
    --pdp-grey: #5f5f66;
    --pdp-line: #e6e3dc;
    --pdp-card: #fff;
    --pdp-ok: #1E7F4F;
    --pdp-bar-h: 64px;
    --pdp-safe: env(safe-area-inset-bottom, 0px);
    --pdp-top: calc(var(--b2b-header-bottom, 0px) + 16px);
}

/* ---------------------------------------------------------------- breadcrumb: path only (the H1 is the name) */
.elementor-25741 .custom-breadcrumbs.woocommerce-breadcrumb {
    font-size: 0 !important;          /* hides the trailing product-name text node; links restore their size */
    line-height: 1.5;
    color: var(--pdp-grey);
}
.elementor-25741 .custom-breadcrumbs.woocommerce-breadcrumb a:not(:first-of-type) {
    font-size: 15px;
    color: var(--pdp-grey);
    text-underline-offset: 3px;
    display: inline-block;
    padding: 10px 0;                  /* 44px tap row */
    line-height: 24px;
}
.elementor-25741 .custom-breadcrumbs.woocommerce-breadcrumb a:first-of-type {
    padding: 14px;
    margin: -14px -14px -14px 0;
    box-sizing: content-box;
    background-origin: content-box;
}
.elementor-25741 .custom-breadcrumbs img.delim {
    width: 14px;
    height: 14px;
    margin: 0 6px;
    vertical-align: middle;
    opacity: .6;
}
.elementor-25741 .custom-breadcrumbs img.delim:last-of-type { display: none; }
/* phones: home + the product's category only (back-link pattern), one line */
@media (max-width: 767px) {
    .elementor-25741 .custom-breadcrumbs.woocommerce-breadcrumb { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .elementor-25741 .custom-breadcrumbs.woocommerce-breadcrumb a:not(:first-of-type):not(:last-of-type) { display: none; }
    .elementor-25741 .custom-breadcrumbs img.delim:not(:first-of-type) { display: none; }
    .elementor-25741 .custom-breadcrumbs.woocommerce-breadcrumb a:last-of-type:not(:first-of-type) { max-width: calc(100% - 60px); overflow: hidden; text-overflow: ellipsis; vertical-align: middle; }
}
/* Space above / below the breadcrumb (owner: "extra space"). Elementor's own padding vars won over the ones
   here (higher specificity), and an empty shortcode section (c7c1250) plus a -10px margin added ~30px more.
   Header -> path 12px (8px phones), path -> gallery 12px (8px phones); the 44px link row stays the tap target. */
body .elementor-25741 .elementor-element.elementor-element-c7c1250:not(:has(.elementor-shortcode > *)) { display: none !important; }
body .elementor-25741 .elementor-element.elementor-element-99dc874 { margin-top: 0 !important; }
body .elementor-25741 .elementor-element.elementor-element-99dc874 > .e-con-inner { padding-top: 12px !important; padding-bottom: 0 !important; }
body .elementor-25741 .elementor-element.elementor-element-8d74ee1 > .e-con-inner { padding-top: 12px !important; }
@media (max-width: 767px) {
    body .elementor-25741 .elementor-element.elementor-element-99dc874 > .e-con-inner { padding-top: 8px !important; }
    body .elementor-25741 .elementor-element.elementor-element-8d74ee1 > .e-con-inner { padding-top: 8px !important; }
}

/* ---------------------------------------------------------------- two columns: gallery | buy box */
.elementor-25741 .elementor-element-8d74ee1 { --padding-top: 16px; --padding-bottom: 40px; }
@media (min-width: 768px) {
    .elementor-25741 .elementor-element-8d74ee1 > .e-con-inner {
        flex-direction: row !important;
        align-items: flex-start;
        column-gap: 48px;
    }
    .elementor-25741 .elementor-element-5868d12 {
        --width: calc(54% - 24px) !important;
        --padding-left: 0px; --padding-right: 0px;
    }
    .elementor-25741 .elementor-element-cd0069e {
        --width: calc(46% - 24px) !important;
        position: sticky;
        top: var(--pdp-top);
        align-self: flex-start;
    }
    /* Edges: both columns fill their share with no inner padding, so the gallery's top = the title's top and the
       outer edges = the breadcrumb / related row edges (the template had 10px around the buy column and a 60px
       left padding on the gallery column, so the photo sat 60px short of the row edge). */
    body .elementor-25741 .elementor-element.elementor-element-5868d12,
    body .elementor-25741 .elementor-element.elementor-element-cd0069e {
        --padding-top: 0px; --padding-right: 0px; --padding-bottom: 0px; --padding-left: 0px;
        padding: 0 !important;
    }
    /* one photo: no empty thumbnail column (it took 1px + a 12px gap off the photo) */
    .elementor-25741 .product-image-widget.desktop-view .gallery-images:not(:has(img)) { display: none; }
    /* the path starts at the product row's edge (it sat 80px outside it at 1440) */
    body .elementor-25741 .elementor-element.elementor-element-99dc874 > .e-con-inner { max-width: min(100%, var(--b2b-pdp-row, 1200px)) !important; margin-inline: auto; }
}
/* the product row is 1120px wide up to 1366px (template); the path follows it */
@media (min-width: 768px) and (max-width: 1366px) { .elementor-25741 { --b2b-pdp-row: 1120px; } }
@media (min-width: 768px) and (max-width: 1024px) {
    .elementor-25741 .elementor-element-8d74ee1 > .e-con-inner { column-gap: 24px; }
    .elementor-25741 .elementor-element-5868d12 { --width: calc(50% - 12px) !important; }
    .elementor-25741 .elementor-element-cd0069e { --width: calc(50% - 12px) !important; }
}

/* Phones: one column. The gallery column dissolves (display: contents) so the order is
   gallery -> buy box -> description/specs, while desktop keeps the details under the gallery. */
@media (max-width: 767px) {
    .elementor-25741 .elementor-element-8d74ee1 { --padding-top: 8px; --padding-bottom: 24px; --padding-left: 16px; --padding-right: 16px; }
    /* one 16px side gutter on phones (header, path, product, related row; the template's mobile setting gave 20px) */
    body .elementor-25741 .elementor-element.elementor-element-8d74ee1,
    body .elementor-25741 .elementor-element.elementor-element-99dc874 { padding-left: 16px !important; padding-right: 16px !important; }
    body .elementor-25741 .elementor-element.elementor-element-99dc874 > .e-con-inner { max-width: 100% !important; }
    .elementor-25741 .elementor-element-8d74ee1 > .e-con-inner { flex-direction: column !important; row-gap: 16px; }
    .elementor-25741 .elementor-element-5868d12 { display: contents; }
    .elementor-25741 .elementor-element-7241f10 { order: 1; width: 100%; }
    .elementor-25741 .elementor-element.elementor-element-cd0069e { order: 2; --padding-top: 0px; padding-top: 0; }
    .elementor-25741 .elementor-element-b2bpdd1 { order: 3; width: 100%; }
}

/* ---------------------------------------------------------------- gallery */
.elementor-25741 .product-image-widget.desktop-view { gap: 12px; }
.elementor-25741 .product-image-widget .main-image {
    border-color: var(--pdp-line);
    border-radius: 16px;
    background: #fff;
}
.woocommerce-page .elementor-25741 .product-image-widget .main-image img {
    height: 440px;
    border-radius: 16px;
}
.elementor-25741 .product-image-widget .gallery-images { max-height: 440px; gap: 8px; }
.elementor-25741 .product-image-widget .gallery-images img.gallery-image {
    width: 80px;
    height: 80px;
    border-radius: 10px;
    border: 1px solid var(--pdp-line);
    background: #fff;
    object-fit: contain;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.elementor-25741 .product-image-widget img.gallery-image.active {
    border-color: var(--pdp-ink);
    box-shadow: inset 0 0 0 1px var(--pdp-ink);
}
.elementor-25741 .product-image-widget .navigation span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin: 0 8px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .9);
    box-shadow: 0 1px 4px rgba(28, 27, 31, .12);
}
@media (hover: none) {
    .elementor-25741 .product-image-widget .navigation { opacity: 1; }
}
.elementor-25741 .product-logo { top: 12px; left: 12px; }
.elementor-25741 img.category-logo-image { max-height: 24px; max-width: 120px; }

/* Phone slider: a calm, fixed-height frame (no jump when Swiper starts), swipe + dots, no arrows. */
@media (max-width: 767px) {
    .elementor-25741 .product-image-widget.mobile-slider { overflow: visible; }
    .elementor-25741 .mobile-slider .swiper-container { min-height: 0; margin: 0 !important; padding-bottom: 0; position: relative !important; }
    .elementor-25741 .mobile-slider .swiper-container:has(.swiper-pagination) { padding-bottom: 44px; } /* the dots' 44px row */
    .elementor-25741 .elementor-element-7241f10 > .elementor-widget-container { margin: 0 !important; }
    .elementor-25741 .mobile-slider .swiper-wrapper { margin-bottom: 0; }
    /* Elementor Pro clips `.swiper-container:not(.swiper-container-initialized) > .swiper-wrapper` (its own Swiper
       6 class name). The gallery's newer Swiper marks itself `.swiper-initialized`, so the rule stayed on: the wrapper
       is the element Swiper translates, its clip box moved with it, and slides 2+ were cut away (an empty frame).
       Once initialised the wrapper must not clip; the container (overflow hidden) still shows one photo only. */
    .elementor-25741 .mobile-slider .swiper-container.swiper-initialized > .swiper-wrapper { overflow: visible !important; gap: 0 !important; }
    .elementor-25741 .mobile-slider .swiper-slide {
        height: min(260px, 30vh);
        border-color: var(--pdp-line);
        border-radius: 16px;
    }
    .elementor-25741 .mobile-slider .swiper-slide img {
        width: 100%;
        height: 100%;
        max-height: none;
        padding: 16px;
        box-sizing: border-box;
        object-fit: contain;
    }
    .elementor-25741 .mobile-slider .swiper-button-next,
    .elementor-25741 .mobile-slider .swiper-button-prev { display: none !important; }
    /* Dots: an 8px dot drawn inside a 28 x 44px hit area; the hit areas sit side by side (no overlap) and shrink
       evenly when a product has many photos. A dot tap only changes the slide (pdp.js keeps it from the zoom). */
    .elementor-25741 .product-image-widget .swiper-pagination.swiper-pagination-bullets {
        bottom: 0 !important;
        top: auto !important;
        left: 0 !important;
        width: 100% !important;
        height: 44px;
        display: flex;
        justify-content: center;
        align-items: stretch;
        line-height: 0;
    }
    .elementor-25741 .mobile-slider .swiper-pagination-bullet {
        position: relative;
        flex: 0 1 28px;
        width: 28px;
        height: 44px;
        margin: 0 !important;
        border-radius: 10px;
        background: transparent;
        opacity: 1;
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
    }
    .elementor-25741 .mobile-slider .swiper-pagination-bullet::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        width: 8px;
        height: 8px;
        margin: -4px 0 0 -4px;
        border-radius: 50%;
        background: #cfccc6;
        transition: background-color .2s ease, transform .2s ease;
    }
    .elementor-25741 .mobile-slider .swiper-pagination-bullet-active::after { background: var(--pdp-ink); transform: scale(1.25); }
    .elementor-25741 .mobile-slider .swiper-pagination-bullet:focus { outline: none; }
    .elementor-25741 .mobile-slider .swiper-pagination-bullet:focus-visible { outline: 2px solid var(--pdp-pink); outline-offset: -8px; }
}

/* ---------------------------------------------------------------- buy box */
/* Order (owner, 2026-09-28): title -> [facts: logo + stickers, "what's inside", stock · pack · carton, SKU] ->
   short description -> buy card -> tier table -> points. The column has no gap; each part sets its own space above:
   8px inside the facts block, 12px title -> facts and around the tier table / points, 16px before the description
   and the buy card. Empty parts are display:none, so they never add space. */
.elementor-25741 .elementor-element.elementor-element-cd0069e { --gap: 0px 0px; --row-gap: 0px; gap: 0 !important; }
.elementor-25741 .elementor-element-cd0069e > .elementor-element { margin: 0 !important; }
.elementor-25741 .elementor-element-675ff9a { order: 1; }
.elementor-25741 .elementor-element-cd0069e > .elementor-element.elementor-element-b2bpdf1 { order: 2; margin-top: 12px !important; }
.elementor-25741 .elementor-element-cd0069e > .elementor-element.elementor-element-8ebb504 { order: 3; margin-top: 16px !important; }
.elementor-25741 .elementor-element-cd0069e > .elementor-element.elementor-element-50f9679 { order: 4; margin-top: 16px !important; }
.elementor-25741 .elementor-element-cd0069e > .elementor-element.elementor-element-c95ee2b { order: 5; margin-top: 12px !important; }
.elementor-25741 .elementor-element-cd0069e > .elementor-element.elementor-element-6660584 { order: 6; margin-top: 12px !important; }
/* the subtitle widget is printed inside the facts block now (pdp.php); the empty template widget stays out */
body .elementor-25741 .elementor-element.elementor-element-cdf969f,
body .elementor-25741 .elementor-element.elementor-element-8ebb504:not(:has(.b2b-pdp-excerpt, .elementor-heading-title)),
body .elementor-25741 .elementor-element.elementor-element-b2bpdf1:not(:has(.b2b-pdp-facts > *)) { display: none !important; }

.elementor-25741 .elementor-element-675ff9a h1.product_title,
.elementor-25741 #product-title h1 {
    margin: 0;
    font-size: 26px !important;
    line-height: 1.3 !important;
    font-weight: 600 !important;
    color: var(--pdp-ink);
}
@media (max-width: 767px) {
    .elementor-25741 .elementor-element-675ff9a h1.product_title { font-size: 21px !important; }
}

/* Brand logo + the product's variant stickers (the YITH info badges "חום", "המפ", "לבן", "קטן + פילטר"...), drawn as
   the same round discs as the catalog cards (.b2b-sticker, badge colours via --b2b-st-bg/fg) and lifted off the
   photo: one row that wraps, 8px gap, 44px discs (40px on phones). The disc text is real text (screen readers). */
.b2b-pdp-badges { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0; }
.b2b-pdp-brand { display: inline-flex; align-items: center; height: 24px; }
.b2b-pdp-brand img { display: block; height: 24px; width: auto; max-width: 110px; object-fit: contain; }
.b2b-pdp-stickers { --b2b-st: 44px; --b2b-st-fs: 11px; display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; }
.b2b-pdp-stickers .b2b-sticker {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: var(--b2b-st);
    height: var(--b2b-st);
    margin: 0;
    padding: 3px;
    border-radius: 50%;
    background: var(--b2b-st-bg, #2D2D2D);
    color: var(--b2b-st-fg, #fff);
    box-shadow: inset 0 0 0 1px rgba(28, 27, 31, .1), 0 1px 2px rgba(28, 27, 31, .16);
    overflow: hidden;
    text-align: center;
    animation: b2bPdpSticker .18s ease-out both;
    animation-delay: calc(var(--b2b-st-i, 0) * 40ms);
}
.b2b-pdp-stickers .b2b-sticker__t {
    display: block;
    max-width: 100%;
    color: inherit !important;
    font-size: var(--b2b-st-fs) !important;
    line-height: 1.05 !important;
    font-weight: 700 !important;
    white-space: normal;
    overflow-wrap: anywhere;
}
@keyframes b2bPdpSticker { from { opacity: 0; transform: scale(.9); } }
@media (max-width: 767px) { .b2b-pdp-stickers { --b2b-st: 40px; --b2b-st-fs: 10.5px; } }
/* fallback (catalog helper missing): the YITH sticker itself, made static */
.b2b-pdp-sticker__art { display: block; width: var(--b2b-st); height: var(--b2b-st); }
html body .b2b-pdp-sticker__art .yith-wcbm-badge {
    position: static !important; inset: auto !important; margin: 0 !important; transform: none !important;
    width: var(--b2b-st) !important; height: var(--b2b-st) !important; box-sizing: border-box !important; padding: 3px !important;
    display: flex !important; align-items: center; justify-content: center;
}
.b2b-sticker--yith { background: none !important; box-shadow: none !important; padding: 0 !important; }

/* Facts under the title: stickers / stock · pack · carton / SKU (copyable), 8px apart (the copy button keeps its
   44px target through negative margins, so it does not open the gap). */
.b2b-pdp-facts { display: flex; flex-direction: column; gap: 8px; font-size: 14px; line-height: 1.4; color: var(--pdp-grey, #5f5f66); }
/* style.css sets every span to 18px: the facts keep their own scale (PDP and the info popup) */
.b2b-pdp-facts .b2b-pdp-meta span, .b2b-pdp-facts .b2b-pdp-sku__label { font-size: inherit !important; }
.b2b-pdp-sku { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 6px; min-height: 24px; }
.b2b-pdp-sku__val {
    font-variant-numeric: tabular-nums;
    letter-spacing: .02em;
    color: var(--pdp-ink, #1c1b1f);
    font-size: 15px;
    overflow-wrap: anywhere;
    user-select: all;
}
.b2b-pdp-copy {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-width: 44px;
    min-height: 44px;
    margin: -10px -8px;
    padding: 0 8px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: var(--pdp-grey);
    font: inherit;
    font-size: 13px;
    cursor: pointer;
}
.b2b-pdp-copy:hover { color: var(--pdp-ink); background: rgba(28, 27, 31, .05); }
.b2b-pdp-copy svg { flex: none; }
.b2b-pdp-copy__ok {
    font-size: 13px !important;
    color: var(--pdp-ok);
    opacity: 0;
    transform: translateX(4px);
    transition: opacity .2s ease, transform .2s ease;
    pointer-events: none;
}
.b2b-pdp-copy.is-copied .b2b-pdp-copy__ok { opacity: 1; transform: none; }
.b2b-pdp-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 17px; overflow: hidden; }
.b2b-pdp-dot { display: none; }
/* The separator sits in the gap before each fact (absolute, no width of its own). A fact that starts a wrapped line
   has its separator outside the block's start edge, where overflow clips it: no line starts or ends with a lone dot. */
.b2b-pdp-meta > * { position: relative; }
.b2b-pdp-meta > :not(.b2b-pdp-dot) ~ :not(.b2b-pdp-dot)::before { content: "·"; position: absolute; inset-inline-start: -12px; width: 7px; text-align: center; color: #b9b6ae; }
.b2b-pdp-stock { display: inline-flex; align-items: center; gap: 6px; }
.b2b-pdp-stock::before { content: ""; flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--pdp-ok, #1E7F4F); }
.b2b-pdp-stock.is-out { color: #B42318; }
.b2b-pdp-stock.is-out::before { background: #B42318; }
.b2b-pdp-pack, .b2b-pdp-carton { white-space: nowrap; }

/* "What's inside" (ACF short_description, in the facts block): quiet grey like the catalog cards' subline. */
.b2b-pdp-sub { margin: 0 !important; font-size: 15px; line-height: 1.45; color: #6B6B6B; overflow-wrap: anywhere; }

/* Short description (post excerpt, normalised in pdp.php): short paragraphs + a compact bullet list, calm grey. */
.b2b-pdp-excerpt,
.b2b-pdp-prose { display: flex; flex-direction: column; gap: 4px; font-size: 15px; line-height: 1.55; color: #5F5F5F; overflow-wrap: anywhere; }
.b2b-pdp-prose { gap: 6px; font-size: 16px; line-height: 1.65; color: #3d3d42; }
.b2b-pdp-excerpt p,
.b2b-pdp-prose p { margin: 0 !important; }
.b2b-pdp-excerpt strong, .b2b-pdp-excerpt b { font-weight: 600; color: var(--pdp-ink, #1c1b1f); }
.b2b-pdp-list { display: flex; flex-direction: column; gap: 4px; margin: 0 !important; padding: 0 !important; list-style: none !important; }
.b2b-pdp-list li { position: relative; margin: 0 !important; padding-inline-start: 16px; list-style: none !important; }
.b2b-pdp-list li::before {
    content: "";
    position: absolute;
    inset-inline-start: 3px;
    top: calc(.775em - 2.5px);
    top: calc(.5lh - 2.5px);          /* centred on the first line */
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: currentColor;
    opacity: .55;
}
/* fallback while an old page (cached HTML) still prints the heading */
.elementor-25741 .elementor-element-8ebb504 .elementor-heading-title {
    font-size: 15px !important;
    font-weight: 400 !important;
    line-height: 1.55 !important;
    color: #5F5F5F !important;
}

/* The buy card: sale note, price + quantity, then the rules as quiet lines. */
.elementor-25741 .elementor-element.elementor-element-50f9679 {
    --padding-top: 16px; --padding-bottom: 16px; --padding-left: 16px; --padding-right: 16px;
    padding: 16px !important;
    --gap: 8px 8px; gap: 8px;
    min-height: 0 !important;
    margin-top: 4px !important;
    background: var(--pdp-card);
    border: 1px solid var(--pdp-line);
    border-radius: 16px;
}
.elementor-25741 .elementor-element-25cc202 { order: 1; }
.elementor-25741 .elementor-element-21a419e { order: 2; }
.elementor-25741 .elementor-element-d085654 { order: 3; }
.elementor-25741 .elementor-element-57c37e2 { order: 4; }
.elementor-25741 .elementor-element-50f9679 > .elementor-element { margin: 0 !important; }
.elementor-25741 .elementor-element-25cc202 .elementor-shortcode:not(:has(.sale-data)) { display: none; }
.elementor-25741 .elementor-element-50f9679 > .elementor-element:has(> .elementor-widget-container > .elementor-shortcode:empty),
.elementor-25741 .elementor-element-25cc202:not(:has(.sale-data)),
.elementor-25741 .elementor-element-57c37e2:not(:has(.elementor-widget)) { display: none; }

.elementor-25741 .elementor-element-21a419e::before { display: none !important; } /* cream overlay of the old sticky row */
.elementor-25741 .elementor-element.elementor-element-57c37e2 { --padding-top: 0px; --padding-bottom: 0px; --padding-left: 0px; --padding-right: 0px; padding: 0 !important; }
.elementor-25741 .elementor-element-21a419e {
    flex-direction: column !important;
    align-items: stretch;
    --gap: 4px 4px; gap: 4px;
}
.elementor-25741 #add-to-cart-wrapper {
    --width: 100% !important;
    width: 100%;
    flex-direction: row !important;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 !important;
    min-height: 56px;
}
.elementor-25741 #add-to-cart-wrapper > .elementor-element { --container-widget-width: auto; width: auto !important; max-width: none; margin: 0 !important; }
.elementor-25741 #add-to-cart-wrapper > .elementor-element-f7f0d19 { flex: 1 1 auto; min-width: 0; }
.elementor-25741 #add-to-cart-wrapper > .elementor-element-0b3c6a5 { flex: none; }

/* Price: pack price is the main price; "כולל מע"מ" and the per-unit price are quiet. */
.elementor-25741 .price-display { font-family: inherit !important; line-height: 1.2; display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 8px; row-gap: 2px; }
.elementor-25741 .price-display .total-price {
    font-size: 28px !important;
    font-weight: 700;
    color: var(--pdp-pink);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    flex-basis: 100%;
    order: 1;
}
.elementor-25741 .price-display .total-price ins { text-decoration: none; }
.elementor-25741 .price-display .total-price del { margin-inline-start: 6px; font-size: 16px; font-weight: 400; color: var(--pdp-grey); }
.elementor-25741 .price-display .price-text { order: 3; font-size: 13px; color: var(--pdp-grey); white-space: nowrap; }
.elementor-25741 .price-display .price-per-unit { order: 2; font-size: 14px !important; color: var(--pdp-grey); line-height: 1.3; white-space: nowrap; }
.elementor-25741 .sale-data { margin: 0 !important; gap: 8px; font-size: 13px; }
.elementor-25741 .sale-data .perc-savings { color: var(--pdp-pink-text); font-weight: 600; font-size: 13px; }
.elementor-25741 .sale-data .perc-savings path { fill: currentColor; }
.elementor-25741 .sale-data .uptodate { color: var(--pdp-grey); font-size: 13px; }

/* Quantity: the theme's +/- stepper, 48px targets. Before the first add only "+" shows: a clear pink pill. */
.elementor-25741 .quantity-control-wrapper { position: relative; margin: 0 !important; display: flex; flex-direction: column; align-items: flex-end; }
.elementor-25741 #add-to-cart-wrapper .quantity-control-wrapper .quantity.buttons_added,
.elementor-25741 .elementor-shortcode .quantity-control-wrapper .quantity.buttons_added {
    position: static !important;
    top: auto;
    margin: 0 !important;
    min-height: 0;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 0;
    padding: 0;
    border-radius: 100px;
    box-sizing: border-box;
    width: auto !important;
    flex: none;
    max-width: none !important;
}
.elementor-25741 #add-to-cart-wrapper .quantity-control-wrapper .quantity.buttons_added a.plus,
.elementor-25741 #add-to-cart-wrapper .quantity-control-wrapper .quantity.buttons_added a.minus {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px !important;
    height: 46px !important;
    margin: 0;
    padding: 0;
    border: 0;
    flex: none;
    border-radius: 50%;
    background: transparent;
    font-size: 24px !important;
    line-height: 1;
    text-decoration: none;
    transition: background-color .15s ease, transform .15s ease;
}
.elementor-25741 #add-to-cart-wrapper .quantity-control-wrapper .quantity.buttons_added a:hover { background: rgba(255, 255, 255, .14); }
.elementor-25741 #add-to-cart-wrapper .quantity-control-wrapper .quantity.buttons_added a:active { transform: scale(.94); }
.elementor-25741 #add-to-cart-wrapper .quantity-control-wrapper input.qty {
    flex: none;
    width: 52px !important;
    max-width: none !important;
    height: 46px;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0 !important;
    text-align: center;
    font-size: 18px !important;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}
.elementor-25741 #add-to-cart-wrapper .quantity-control-wrapper .quantity.buttons_added a.plus.disabled {
    opacity: .35;
    pointer-events: none;
}
.elementor-25741 #add-to-cart-wrapper .quantity-control-wrapper .quantity.buttons_added a.plus.disabled::before { content: "+"; }
/* the stepper keeps the site-wide look (pink pill, white text: style.css); first add = one pill "+ הוספה לסל" */
.elementor-25741 #add-to-cart-wrapper .quantity-control-wrapper .quantity.buttons_added.initial-state {
    background: transparent !important;
    padding: 0;
}
.elementor-25741 #add-to-cart-wrapper .quantity-control-wrapper .quantity.initial-state a.plus {
    width: auto !important;
    min-width: 148px;
    height: 48px !important;
    padding: 0 20px;
    gap: 8px;
    border-radius: 100px;
    background: var(--pdp-pink);
    color: #fff;
    font-weight: 600;
    box-shadow: 0 2px 8px rgba(223, 26, 129, .22);
}
.elementor-25741 #add-to-cart-wrapper .quantity-control-wrapper .quantity.initial-state a.plus::before {
    content: "";
    width: 14px;
    height: 14px;
    background: linear-gradient(currentColor, currentColor) center / 100% 2px no-repeat,
                linear-gradient(currentColor, currentColor) center / 2px 100% no-repeat;
}
.elementor-25741 #add-to-cart-wrapper .quantity-control-wrapper .quantity.initial-state a.plus { font-size: 0 !important; }
.elementor-25741 #add-to-cart-wrapper .quantity-control-wrapper .quantity.initial-state a.plus::after { content: "הוספה לסל"; font-size: 16px; }
.elementor-25741 #add-to-cart-wrapper .quantity-control-wrapper .quantity.initial-state a.plus:hover { background: var(--pdp-pink-dark); }
.elementor-25741 #add-to-cart-wrapper .quantity-control-wrapper .quantity.initial-state a.minus,
.elementor-25741 #add-to-cart-wrapper .quantity-control-wrapper .quantity.initial-state input.qty { display: none !important; }
.elementor-25741 .quantity-control-wrapper .no-more-units {
    position: static;
    width: auto;
    margin-top: 6px;
    font-size: 13px;
    color: var(--pdp-grey);
    text-align: end;
    white-space: nowrap;
}
.elementor-25741 .quantity-control-wrapper .no-more-units path { fill: currentColor; }
/* the static "אפשר עד N יח' בהזמנה" line already says it */
.elementor-25741 .elementor-element-50f9679:has(.limit-product .elementor-heading-title) .no-more-units { display: none !important; }

/* "עודכן בסל" after each change (pdp.js), same wording as the catalog cards */
.b2b-pdp-ok {
    position: absolute;
    top: calc(100% + 6px);
    inset-inline-end: 0;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 13px;
    color: var(--pdp-ok);
    white-space: nowrap;
    opacity: 0;
    transform: translateY(4px);
    transition: opacity .2s ease, transform .2s ease;
    pointer-events: none;
}
.b2b-pdp-ok.is-on { opacity: 1; transform: none; }

/* Rules: quiet grey lines with small grey icons. */
.elementor-25741 .quantity-step-info { margin: 0 !important; gap: 6px; font-size: 14px; color: var(--pdp-grey); }
.elementor-25741 .quantity-step-info svg { width: 16px; height: 16px; }
.elementor-25741 .quantity-step-info path { fill: currentColor; }
.elementor-25741 .limit-product .elementor-heading-title {
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
    color: var(--pdp-grey) !important;
    padding-right: 22px !important;
}
.elementor-25741 .limit-product .elementor-heading-title::before { width: 16px !important; height: 16px !important; filter: grayscale(1) opacity(.7); }

/* Back to category: a quiet text link, not a second big button next to the primary action. */
.elementor-25741 .elementor-element-53329e3 { width: auto !important; align-self: flex-start; }
.elementor-25741 .elementor-element-cd0069e .elementor-widget > .elementor-widget-container { margin: 0 !important; }
.elementor-25741 .elementor-element-53329e3 .elementor-button {
    min-height: 44px;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: var(--pdp-grey) !important;
    fill: var(--pdp-grey) !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    box-shadow: none !important;
    display: inline-flex;
    align-items: center;
}
.elementor-25741 .elementor-element-53329e3 .elementor-button:hover .elementor-button-text { text-decoration: underline; text-underline-offset: 3px; }
.elementor-25741 .elementor-element-53329e3 .elementor-button svg { width: 14px; height: 14px; }

/* Points and tier table: small, grey. */
.elementor-25741 .product-points { display: flex; align-items: center; gap: 6px; font-size: 14px; color: var(--pdp-grey); }
.elementor-25741 .product-points svg { width: 16px; height: 16px; }
.elementor-25741 .product-points path { fill: #9a979f; }
.elementor-25741 .product-points span { font-size: 14px !important; }
/* (the old ":has(div div)" test always matched the widget's own wrappers, so an empty tier widget kept its space) */
body .elementor-25741 .elementor-element.elementor-element-6660584:not(:has(.product-points)),
body .elementor-25741 .elementor-element.elementor-element-c95ee2b:not(:has(.elementor-shortcode > *)) { display: none !important; }
.elementor-25741 .product-points a { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; margin: -12px 0; color: inherit; text-decoration: none; }
.elementor-25741 .product-points a:hover span { text-decoration: underline; text-underline-offset: 3px; }

/* Guests: one calm login button in place of the price. */
.elementor-25741 #add-to-cart-wrapper .pleaselogin { margin: 0; }
.elementor-25741 #add-to-cart-wrapper .pleaselogin button {
    width: auto;
    min-width: 176px;
    min-height: 48px;
    padding: 0 20px;
    font-size: 16px !important;
    white-space: nowrap;
}

/* ---------------------------------------------------------------- phone: purchase row sticks above the order bar */
@media (max-width: 767px) {
    body.single-product.b2b-pdp-has-buybar { padding-bottom: calc(var(--pdp-bar-h, 64px) + env(safe-area-inset-bottom, 0px)) !important; }
    body.single-product.b2b-pdp-has-buybar.b2b-ot-has-bar {
        padding-bottom: calc(64px + var(--b2b-ot-h, 60px) + env(safe-area-inset-bottom, 0px)) !important;
    }
    .b2b-pdp-slot { position: relative; }
    .elementor-25741 #add-to-cart-wrapper.b2b-pdp-fixed {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 9989;
        box-sizing: border-box;
        width: 100% !important;
        min-height: 0;
        height: calc(var(--pdp-bar-h) + var(--pdp-safe));
        padding: 8px 16px calc(8px + var(--pdp-safe)) !important;
        background: #fff;
        border-top: 1px solid var(--pdp-line);
        box-shadow: 0 -4px 16px rgba(28, 27, 31, .06);
        animation: b2bPdpBarIn .2s ease both;
    }
    /* a white copy of the row sits right under it, hidden behind the order bar: a frame where the two drift apart
       (fast flick, address bar) shows white, never the page */
    body.b2b-ot-has-bar .elementor-25741 #add-to-cart-wrapper.b2b-pdp-fixed {
        bottom: calc(var(--b2b-ot-h, 60px) + var(--b2b-ot-safe, 0px));
        height: var(--pdp-bar-h);
        padding-bottom: 8px !important;
        box-shadow: 0 var(--pdp-bar-h, 64px) 0 0 #fff;
    }
    .elementor-25741 #add-to-cart-wrapper.b2b-pdp-fixed .price-display .total-price { font-size: 20px !important; }
    .elementor-25741 #add-to-cart-wrapper.b2b-pdp-fixed .price-display .price-text { display: none; }
    .elementor-25741 #add-to-cart-wrapper.b2b-pdp-fixed .price-display .price-per-unit { font-size: 13px !important; }
    .elementor-25741 #add-to-cart-wrapper.b2b-pdp-fixed .no-more-units,
    .elementor-25741 #add-to-cart-wrapper.b2b-pdp-fixed .b2b-pdp-ok { display: none !important; }
    /* one coherent bottom area: on a page with the purchase row the order bar never collapses and never slides, so
       the two bars are one still block (it used to slide back up while the row faded in = a gap for ~250ms) */
    body.b2b-pdp-has-buybar .b2b-ot-bar,
    body.b2b-pdp-has-buybar .b2b-ot-bar.is-collapsed { transform: none !important; transition: opacity 0.15s ease !important; }
    body.b2b-pdp-has-buybar.b2bs-open .b2b-ot-bar,
    body.b2b-pdp-has-buybar.b2bs-open .b2b-ot-bar.is-collapsed { transition: opacity 0.15s ease, visibility 0s linear 0.15s !important; }
    body.b2b-pdp-has-buybar .b2b-ot-pill { display: none !important; }
    /* scroll-to-top always clears the purchase row (fixed offset: it never jumps when the row appears) */
    body.b2b-pdp-has-buybar.b2b-ot-has-bar #ast-scroll-top { bottom: calc(64px + var(--b2b-ot-h, 60px) + 16px + env(safe-area-inset-bottom, 0px)) !important; }
    body.b2b-pdp-has-buybar:not(.b2b-ot-has-bar) #ast-scroll-top { bottom: calc(64px + 16px + env(safe-area-inset-bottom, 0px)) !important; }
    body.b2bs-open .elementor-25741 #add-to-cart-wrapper.b2b-pdp-fixed,
    body.cart-is-open .elementor-25741 #add-to-cart-wrapper.b2b-pdp-fixed { opacity: 0; pointer-events: none; }
}
@keyframes b2bPdpBarIn { from { opacity: 0; } to { opacity: 1; } }

/* ---------------------------------------------------------------- description + specifications */
.b2b-pdp-info { margin-top: 32px; border-top: 1px solid var(--pdp-line); }
@media (max-width: 767px) { .b2b-pdp-info { margin-top: 4px; } }
.b2b-pdp-sec { border-bottom: 1px solid var(--pdp-line); }
.b2b-pdp-sec__sum {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 56px;
    list-style: none;
    cursor: pointer;
}
.b2b-pdp-sec__sum::-webkit-details-marker { display: none; }
.b2b-pdp-sec__sum::marker { content: ""; }
.b2b-pdp-sec__title { margin: 0 !important; font-size: 18px !important; font-weight: 600 !important; line-height: 1.3 !important; color: var(--pdp-ink) !important; }
.b2b-pdp-sec__chev {
    flex: none;
    width: 10px;
    height: 10px;
    margin-inline-end: 6px;
    border-right: 2px solid var(--pdp-grey);
    border-bottom: 2px solid var(--pdp-grey);
    transform: rotate(135deg);              /* closed: points to the inline end (left in RTL) */
    transition: transform .2s ease;
}
.b2b-pdp-sec[open] .b2b-pdp-sec__chev { transform: translateY(-3px) rotate(45deg); } /* open: points down */
.b2b-pdp-sec__body { padding: 0 0 20px; font-size: 16px; line-height: 1.7; color: #3d3d42; overflow-wrap: anywhere; }
.b2b-pdp-sec[open] .b2b-pdp-sec__body { animation: b2bPdpFade .2s ease both; }
.b2b-pdp-sec__body > :first-child { margin-top: 0; }
.b2b-pdp-sec__body > :last-child { margin-bottom: 0; }
.b2b-pdp-sec__body img { max-width: 100%; height: auto; }
.b2b-pdp-specs { margin: 0; display: grid; grid-template-columns: 1fr; }
.b2b-pdp-spec { display: grid; grid-template-columns: minmax(110px, 38%) 1fr; gap: 12px; padding: 10px 0; border-top: 1px solid #f0ede6; }
.b2b-pdp-spec:first-child { border-top: 0; padding-top: 0; }
.b2b-pdp-spec dt { margin: 0; font-size: 14px; color: var(--pdp-grey); font-weight: 400; }
.b2b-pdp-spec dd { margin: 0; font-size: 15px; color: var(--pdp-ink); font-variant-numeric: tabular-nums; }
.b2b-pdp-spec dd a { color: var(--pdp-pink-text); display: inline-flex; align-items: center; min-height: 44px; margin: -13px 0; }
@keyframes b2bPdpFade { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }

/* ---------------------------------------------------------------- more from the category (real catalog cards) */
.elementor-25741 .elementor-element.elementor-element-b2bpdr0 { --padding-top: 8px; --padding-bottom: 48px; display: flex; flex-direction: column; padding-top: 8px; padding-bottom: 48px; }
.elementor-25741 .elementor-element-b2bpdr0 > .e-con-inner, .elementor-25741 .elementor-element-b2bpdr0:not(:has(> .e-con-inner)) > .elementor-element { width: 100%; max-width: min(100%, 1200px); margin-inline: auto; }
@media (max-width: 1366px) { .elementor-25741 .elementor-element-b2bpdr0 > .e-con-inner, .elementor-25741 .elementor-element-b2bpdr0:not(:has(> .e-con-inner)) > .elementor-element { max-width: min(100%, 1120px); } }
/* tablets / small laptops: the same 20px side gutter as the product above (the row used to touch the screen edges) */
@media (min-width: 768px) and (max-width: 1199px) { .elementor-25741 .elementor-element.elementor-element-b2bpdr0 { --padding-left: 20px; --padding-right: 20px; padding-left: 20px; padding-right: 20px; } }
@media (max-width: 767px) { .elementor-25741 .elementor-element.elementor-element-b2bpdr0 { --padding-left: 16px; --padding-right: 16px; --padding-bottom: 32px; padding: 8px 16px 32px; } }
/* Card size = the category grid's card at the same viewport: 4 per row from 1024px (gap 20), 3 on tablets (gap 16),
   phones ~2 (gap 12) with a peek of the next card, since phones swipe without arrows. Placeholders use the same box. */
/* Placeholder heights = the real card heights of the shared card anatomy (carton + stock/SKU lines, price at the
   bottom), measured 2026-09-28: logged-in 411-501 (1280-1440, kiosk 411), 439 (768), 371-425 (phones);
   guests 325 desktop / 286 phones. Defaults sit mid-range; pdp.js
   replaces these with the height it measured on this viewer's previous product page (same width band). */
.b2b-pdp-related { --pdp-gap: 20px; --pdp-card-w: calc((100% - 3 * var(--pdp-gap)) / 4); --pdp-card-h: 325px; width: 100%; }
body.logged-in .b2b-pdp-related { --pdp-card-h: 450px; }
@media (max-width: 1023px) { body.logged-in .b2b-pdp-related { --pdp-card-h: 440px; } }
@media (max-width: 1023px) { .b2b-pdp-related { --pdp-gap: 16px; --pdp-card-w: calc((100% - 2 * var(--pdp-gap)) / 3); } }
@media (max-width: 767px) {
    .b2b-pdp-related { --pdp-gap: 12px; --pdp-card-w: calc((100% - var(--pdp-gap)) / 2.1); --pdp-card-h: 286px; }
    body.logged-in .b2b-pdp-related { --pdp-card-h: 390px; }
}
.b2b-pdp-related__head { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 4px 16px; margin-bottom: 12px; }
.b2b-pdp-related__title { margin: 0 !important; font-size: 20px !important; font-weight: 600 !important; line-height: 1.3 !important; color: var(--pdp-ink) !important; }
.b2b-pdp-related__all { display: inline-flex; align-items: center; min-height: 44px; font-size: 14px; color: var(--pdp-pink-text); text-underline-offset: 3px; }
.b2b-pdp-related__body { position: relative; display: block; min-height: var(--pdp-card-h); }
.b2b-pdp-related__phrow { display: flex; gap: var(--pdp-gap); padding: 2px 2px 8px; overflow: hidden; } /* = the card row's padding */
.b2b-pdp-related__body.is-loaded { min-height: 0; }
.b2b-pdp-related__ph { flex: none; width: var(--pdp-card-w); height: var(--pdp-card-h); border-radius: 16px; background: #f1eee7; animation: b2bPdpPulse 1.4s ease-in-out infinite; }
@keyframes b2bPdpPulse { 50% { opacity: .55; } }
.b2b-pdp-related__cards { animation: b2bPdpFade .25s ease both; }

/* the catalog grid becomes one scroll row (arrows from window.b2bRowNav on desktop, swipe on phones) */
html body.single-product .b2b-pdp-related .elementor-3684 .elementor-wc-products .woocommerce > ul.products.elementor-grid {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: var(--pdp-gap) !important;
    margin: 0 !important;
    padding: 2px 2px 8px !important;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    grid-template-columns: none !important;
}
html body.single-product .b2b-pdp-related .elementor-3684 .elementor-wc-products .woocommerce > ul.products.elementor-grid::-webkit-scrollbar { display: none; }
html body.single-product .b2b-pdp-related .elementor-3684 .elementor-wc-products .woocommerce > ul.products.elementor-grid > li.product {
    flex: 0 0 var(--pdp-card-w) !important;
    width: var(--pdp-card-w) !important;
    max-width: none !important;
    margin: 0 !important;
    scroll-snap-align: start;
}
html body.single-product .b2b-pdp-related .elementor-3684 .elementor-wc-products .woocommerce > ul.products::before,
html body.single-product .b2b-pdp-related .elementor-3684 .elementor-wc-products .woocommerce > ul.products::after { display: none !important; }

/* Same card anatomy as the category grid. The cards are the category's own markup inside the same wrappers, so the
   grid rules in style.css apply; only these page-level differences are undone here:
   - the product template's legacy stepper CSS (`.elementor-shortcode .quantity.buttons_added { position: absolute;
     top: 8px; min-height: 55px; margin-top: -8px }`, printed inline for the buy-box stepper) also matched the card
     steppers: an in-cart card's stepper grew to 55px, and a stepper shown after "+" sat at the TOP of the card over
     the photo and the "i". The card stepper stays in the bottom-left corner (12/12, 44px), as on the category page;
   - the search panel's SKU line inside the photo (the cards come from its endpoint; category cards have none). */
html body .b2b-pdp-related .elementor-wc-products ul.products > li.product.type-product .quantity.buttons_added {
    top: auto !important;
    min-height: 0 !important;
    margin-top: 0 !important;
}
html body .b2b-pdp-related .elementor-wc-products ul.products > li.product.type-product .b2bs-card-sku { display: none !important; }

/* shared row arrows: centred on the image area, a narrower fade over cards; phones swipe (no arrows) */
.b2b-pdp-related .b2b-row-nav::before, .b2b-pdp-related .b2b-row-nav::after { width: 40px; bottom: 8px; }
.b2b-pdp-related .b2b-row-nav > .scroll-nav-button { top: 90px !important; transform: none; }
.b2b-pdp-related .b2b-row-nav > .scroll-nav-button.scroll-left { left: 4px; }
.b2b-pdp-related .b2b-row-nav > .scroll-nav-button.scroll-right { right: 4px; }
@media (max-width: 767px), (hover: none) {
    .b2b-pdp-related .b2b-row-nav > .scroll-nav-button { display: none !important; }
    .b2b-pdp-related .b2b-row-nav::before, .b2b-pdp-related .b2b-row-nav::after { display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
    .elementor-25741 *, .b2b-pdp-related * { animation: none !important; transition: none !important; }
    .elementor-25741 #add-to-cart-wrapper.b2b-pdp-fixed { animation: none !important; }
    body.b2b-pdp-has-buybar .b2b-ot-bar,
    body.b2b-pdp-has-buybar .b2b-ot-bar.is-collapsed,
    body.b2b-pdp-has-buybar.b2bs-open .b2b-ot-bar,
    body.b2b-pdp-has-buybar.b2bs-open .b2b-ot-bar.is-collapsed { transition: none !important; }
}

/* ==========================================================================================================
   Product info popup (Elementor popup 3732, opened by the "i" on catalog cards). pdp.js renders .b2b-pp from
   the card; the theme's own fill stays in the DOM but hidden. Desktop: centred modal, photo | details.
   Phones: bottom sheet, one column, the price + stepper row sticks to the sheet's bottom.
   ========================================================================================================== */
#elementor-popup-modal-3732 {
    --pp-pink: #DF1A81;
    --pp-pink-text: #A3125A;
    --pp-ink: #1c1b1f;
    --pp-grey: #5f5f66;
    --pp-line: #e6e3dc;
    --pp-ok: #1E7F4F;
    /* the shared facts / SKU-copy rules read the product page's tokens */
    --pdp-ink: #1c1b1f;
    --pdp-grey: #5f5f66;
    --pdp-ok: #1E7F4F;
    --pdp-line: #e6e3dc;
}
#elementor-popup-modal-3732 .dialog-widget-content {
    width: min(920px, calc(100vw - 48px)) !important;
    max-width: none !important;
    border-radius: 20px !important;
    overflow: hidden;
    box-shadow: 0 24px 64px rgba(28, 27, 31, .22);
}
#elementor-popup-modal-3732 .dialog-message { width: 100% !important; max-width: 100% !important; }
#elementor-popup-modal-3732 .dialog-widget-content.animated {
    animation-name: b2bPpIn !important;
    animation-duration: .2s !important;
    animation-timing-function: ease-out !important;
}
@keyframes b2bPpIn { from { opacity: 0; transform: translateY(8px) scale(.99); } to { opacity: 1; transform: none; } }

/* close: a real 44px round button in the corner; the focus ring surrounds the button itself */
#elementor-popup-modal-3732 .dialog-close-button {
    position: absolute !important;
    top: 12px !important;
    left: 12px !important;
    right: auto !important;
    z-index: 20;
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 44px !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 50%;
    background: rgba(244, 241, 234, .95) !important;
    color: var(--pp-ink) !important;
    font-size: 18px !important;
    line-height: 1 !important;
    transition: background-color .15s ease;
}
#elementor-popup-modal-3732 .dialog-close-button:hover { background: #ebe6db !important; }
#elementor-popup-modal-3732 .dialog-close-button i { position: static !important; margin: 0 !important; font-size: 18px !important; color: inherit !important; outline: none !important; }
#elementor-popup-modal-3732 .dialog-close-button i,
#elementor-popup-modal-3732 .dialog-close-button i::before { margin: 0 !important; padding: 0 !important; background: transparent !important; box-shadow: none !important; border: 0 !important; }
#elementor-popup-modal-3732 .dialog-close-button:focus { outline: none; }
#elementor-popup-modal-3732 .dialog-close-button:focus-visible { outline: 2px solid var(--pp-pink) !important; outline-offset: 2px; }

/* the two columns */
#elementor-popup-modal-3732 .product-popup.b2b-pp-on {
    display: grid !important;
    grid-template-columns: minmax(0, 44fr) minmax(0, 56fr) !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 32px !important;
    align-items: start;
    max-height: min(88vh, 760px) !important;
    padding: 28px 28px 24px !important;
    overflow-y: auto;
    overscroll-behavior: contain;
    box-sizing: border-box;
}
#elementor-popup-modal-3732 .product-popup.b2b-pp-on > .e-con { display: block !important; width: auto !important; min-width: 0; padding: 0 !important; margin: 0 !important; --padding-top: 0px; --padding-bottom: 0px; --padding-left: 0px; --padding-right: 0px; }
#elementor-popup-modal-3732 .product-popup.b2b-pp-on > .e-con > .e-con-inner { width: 100% !important; max-width: none !important; padding: 0 !important; display: block !important; }
/* the theme's fill stays in the DOM (other code reads it) but is not shown */
#elementor-popup-modal-3732 .product-popup.b2b-pp-on .popup-container > .e-con-inner > :not(.b2b-pp),
#elementor-popup-modal-3732 .product-popup.b2b-pp-on .popup-container > :not(.e-con-inner),
#elementor-popup-modal-3732 .product-popup.b2b-pp-on .elementor-element-8cf892f .product-logo,
#elementor-popup-modal-3732 .product-popup.b2b-pp-on .elementor-element-29c170c { display: none !important; }

/* photo: a fixed square box (no jump when the image arrives), dots with 24px targets */
#elementor-popup-modal-3732 .product-popup.b2b-pp-on .product-img { position: sticky; top: 0; margin: 0 !important; }
#elementor-popup-modal-3732 .product-popup.b2b-pp-on .product-img .main-image,
#elementor-popup-modal-3732 .product-popup.b2b-pp-on .product-img .swiper {
    position: relative;
    aspect-ratio: 1 / 1;
    width: 100%;
    border: 1px solid var(--pp-line) !important;
    border-radius: 16px;
    background: #fff;
    overflow: hidden;
}
#elementor-popup-modal-3732 .product-popup.b2b-pp-on .product-img .main-image img,
#elementor-popup-modal-3732 .product-popup.b2b-pp-on .product-img .swiper-slide img {
    width: 100% !important;
    height: 100% !important;
    max-height: none !important;
    padding: 16px !important;
    box-sizing: border-box;
    object-fit: contain !important;
    border-radius: 0 !important;
    background: #fff;
}
#elementor-popup-modal-3732 .product-popup.b2b-pp-on .product-img .swiper-slide { height: auto; aspect-ratio: 1 / 1; }
#elementor-popup-modal-3732 .product-popup.b2b-pp-on .product-img .navigation { opacity: 1; }
#elementor-popup-modal-3732 .product-popup.b2b-pp-on .product-img .navigation span {
    display: inline-flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; margin: 0 8px; border-radius: 50%;
    background: rgba(255, 255, 255, .92); box-shadow: 0 1px 4px rgba(28, 27, 31, .14);
}
#elementor-popup-modal-3732 .product-popup.b2b-pp-on .swiper-pagination { position: absolute !important; left: 0 !important; right: 0 !important; bottom: 2px !important; top: auto !important; z-index: 2; }
#elementor-popup-modal-3732 .product-popup.b2b-pp-on .gallery-dots,
#elementor-popup-modal-3732 .product-popup.b2b-pp-on .swiper-pagination {
    display: flex;
    justify-content: center;
    gap: 0;
    margin-top: 6px;
    width: 100% !important;
}
#elementor-popup-modal-3732 .product-popup.b2b-pp-on .gallery-dots { position: static !important; }
#elementor-popup-modal-3732 .product-popup.b2b-pp-on .gallery-dots .dot,
#elementor-popup-modal-3732 .product-popup.b2b-pp-on .swiper-pagination-bullet {
    position: relative;
    width: 24px !important;
    height: 24px !important;
    margin: 0 !important;
    border-radius: 50%;
    background: transparent !important;
    opacity: 1 !important;
    cursor: pointer;
}
#elementor-popup-modal-3732 .product-popup.b2b-pp-on .gallery-dots .dot::after,
#elementor-popup-modal-3732 .product-popup.b2b-pp-on .swiper-pagination-bullet::after {
    content: "";
    position: absolute;
    inset: 8px;
    border-radius: 50%;
    background: #cfccc6;
    transition: background-color .2s ease, transform .2s ease;
}
#elementor-popup-modal-3732 .product-popup.b2b-pp-on .gallery-dots .dot.active::after,
#elementor-popup-modal-3732 .product-popup.b2b-pp-on .swiper-pagination-bullet-active::after { background: var(--pp-ink); transform: scale(1.15); }

/* details column */
.b2b-pp { display: flex; flex-direction: column; gap: 16px; min-width: 0; padding-top: 4px; color: var(--pp-ink); font-size: 15px; line-height: 1.45; }
.b2b-pp__head { display: flex; flex-direction: column; gap: 8px; padding-inline-end: 52px; } /* clear of the close button */
.b2b-pp__title { margin: 0 !important; font-size: 22px !important; line-height: 1.3 !important; font-weight: 600 !important; color: var(--pp-ink) !important; outline: none; }
.b2b-pp__sub { margin: 0 !important; font-size: 15px; line-height: 1.45; color: #6B6B6B; }
.b2b-pp__head > .b2b-pp__title + * { margin-top: 4px; } /* title -> next part 12px, then 8px steps */
.b2b-pp__badges { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.b2b-pp__brand img { display: block; height: 22px; width: auto; max-width: 110px; object-fit: contain; }
#elementor-popup-modal-3732 .b2b-pp .b2b-stickers.b2b-pp__stickers {
    --b2b-st: 44px; --b2b-st-fs: 11px;
    position: static !important; inset: auto !important; transform: none !important;
    display: flex !important; flex-wrap: wrap !important; gap: 8px !important; margin: 0 !important; padding: 0 !important;
}
#elementor-popup-modal-3732 .b2b-pp .b2b-stickers .b2b-sticker {
    flex: none; display: flex; align-items: center; justify-content: center; box-sizing: border-box;
    width: var(--b2b-st) !important; height: var(--b2b-st) !important; margin: 0 !important; padding: 3px; border-radius: 50%;
    background: var(--b2b-st-bg, #2D2D2D); color: var(--b2b-st-fg, #fff); overflow: hidden; text-align: center;
    box-shadow: inset 0 0 0 1px rgba(28, 27, 31, .1), 0 1px 2px rgba(28, 27, 31, .16);
}
#elementor-popup-modal-3732 .b2b-pp .b2b-stickers .b2b-sticker__t { display: block; max-width: 100%; color: inherit !important; font-size: var(--b2b-st-fs) !important; line-height: 1.05 !important; font-weight: 700 !important; white-space: normal; overflow-wrap: anywhere; }

.b2b-pp__specs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 24px; margin: 0; padding: 0; border-top: 1px solid var(--pp-line); }
.b2b-pp__spec { display: grid; grid-template-columns: auto 1fr; align-items: baseline; gap: 8px; padding: 10px 0; border-bottom: 1px solid #f0ede6; min-width: 0; }
.b2b-pp__spec dt { margin: 0; font-size: 13px; color: var(--pp-grey); font-weight: 400; white-space: nowrap; }
.b2b-pp__spec dt::after { content: ":"; }
.b2b-pp__spec dd { margin: 0; font-size: 14px; color: var(--pp-ink); min-width: 0; overflow-wrap: anywhere; }

.b2b-pp__buy {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 16px;
    border: 1px solid var(--pp-line);
    border-radius: 16px;
    background: #fff;
}
.b2b-pp__price { display: flex !important; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; margin: 0 !important; padding: 0 !important; position: static !important; line-height: 1.2 !important; }
.b2b-pp__price > .woocommerce-Price-amount,
.b2b-pp__price ins .woocommerce-Price-amount { order: 1; font-size: 26px !important; font-weight: 700 !important; color: var(--pp-pink) !important; font-variant-numeric: tabular-nums; white-space: nowrap; }
.b2b-pp__price .woocommerce-Price-amount span,
.b2b-pp__price .woocommerce-Price-amount bdi { font-size: inherit !important; color: inherit !important; }
.b2b-pp__price ins { order: 1; text-decoration: none; }
.b2b-pp__price del { order: 2; font-size: 15px; color: var(--pp-grey); }
.b2b-pp__price del .woocommerce-Price-amount { font-size: 15px !important; color: var(--pp-grey) !important; font-weight: 400 !important; }
.b2b-pp__price .per_unit { position: static !important; inset: auto !important; order: 3; flex-basis: 100%; font-size: 14px !important; color: var(--pp-grey) !important; margin: 0 !important; }
.b2b-pp__vat { order: 2; font-size: 13px; color: var(--pp-grey); }
.b2b-pp__price .sale-data { order: 0; flex-basis: 100%; margin: 0 0 2px !important; }
.b2b-pp__price .pleaselogin { order: 1; margin: 0 !important; }
.b2b-pp__price .pleaselogin button { width: auto; min-width: 176px; min-height: 48px; padding: 0 20px; font-size: 16px !important; white-space: nowrap; }
.b2b-pp__rules { display: flex; flex-direction: column; gap: 4px; }
.b2b-pp__rules > * { position: static !important; display: flex !important; align-items: center; gap: 6px; margin: 0 !important; font-size: 13px !important; color: var(--pp-grey) !important; line-height: 1.4 !important; }
.b2b-pp__rules svg, .b2b-pp__rules img { width: 14px !important; height: 14px !important; opacity: .7; }
.b2b-pp__rules path { fill: currentColor; }
.b2b-pp .promo-area { margin: 0 !important; padding: 10px 12px !important; border-radius: 12px; background: #FFF6FA; font-size: 14px; }

/* quantity deals: a calm card in the scrolling body (promo, "mix" list, tier table), above the buy block */
.b2b-pp__deal { display: flex; flex-direction: column; gap: 10px; }
.b2b-pp__deal:empty { display: none; }
#elementor-popup-modal-3732 .b2b-pp__deal .quantity-pricing-wrapper {
    display: block !important; position: static !important; inset: auto !important; transform: none !important;
    width: auto !important; max-width: none !important; margin: 0 !important; padding: 14px 16px !important;
    border: 1px solid var(--pp-line); border-radius: 16px; background: #fff; box-shadow: none !important;
    font-size: 14px; line-height: 1.5; text-align: start;
}
#elementor-popup-modal-3732 .b2b-pp__deal .quantity-pricing-table { width: 100% !important; max-width: none !important; margin-top: 10px !important; }
#elementor-popup-modal-3732 .b2b-pp__deal .tier-heading { font-size: 14px !important; font-weight: 700; color: var(--pp-pink-text, #B3126A); }
#elementor-popup-modal-3732 .b2b-pp__deal .promo-products-mix { font-size: 13px !important; color: #3d3d42; }

/* price on the right, the stepper on the left, quiet rules underneath (same order as the PDP buy card) */
.b2b-pp__buy:has(.b2b-pp__action) { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "promo promo" "price action" "rules rules"; align-items: center; column-gap: 12px; row-gap: 0; }
.b2b-pp__buy:has(.b2b-pp__action) .promo-area { grid-area: promo; margin-bottom: 8px !important; }
.b2b-pp__buy:has(.b2b-pp__action) .b2b-pp__price { grid-area: price; }
.b2b-pp__buy:has(.b2b-pp__action) .b2b-pp__action { grid-area: action; margin: 0; }
.b2b-pp__buy:has(.b2b-pp__action) .b2b-pp__rules { grid-area: rules; margin-top: 8px; }

/* the card's real + / stepper, now a normal-flow row (no absolute card positions) */
.b2b-pp__action { position: relative; display: flex; align-items: center; justify-content: flex-end; gap: 12px; min-height: 48px; }
#elementor-popup-modal-3732 .b2b-pp__action > * { position: static !important; inset: auto !important; transform: none !important; margin: 0 !important; }
#elementor-popup-modal-3732 .b2b-pp__action .button.add_to_cart_button.btn-plus {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    width: auto !important; min-width: 148px; height: 48px !important; padding: 0 20px !important;
    border-radius: 100px !important; background: var(--pp-pink) !important; color: #fff !important;
    font-size: 0 !important; line-height: 1 !important; box-shadow: 0 2px 8px rgba(223, 26, 129, .22);
}
#elementor-popup-modal-3732 .b2b-pp__action .button.add_to_cart_button.btn-plus::before { content: "+"; font-size: 22px; font-weight: 400; }
#elementor-popup-modal-3732 .b2b-pp__action .button.add_to_cart_button.btn-plus::after { content: "הוספה לסל"; font-size: 16px; font-weight: 600; }
#elementor-popup-modal-3732 .b2b-pp__action .quantity.buttons_added,
#elementor-popup-modal-3732 .b2b-pp__action .product-quantity_new .quantity.buttons_added {
    display: inline-flex; align-items: center; justify-content: space-between;
    position: static !important; inset: auto !important; transform: none !important;
    height: 48px !important; width: auto !important; max-width: none !important; padding: 0 !important; margin: 0 !important; border-radius: 100px !important; box-sizing: border-box;
}
#elementor-popup-modal-3732 .b2b-pp__action .product-quantity_new { display: flex; width: auto !important; height: auto !important; }
#elementor-popup-modal-3732 .b2b-pp__action .quantity.buttons_added a { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 46px !important; height: 46px !important; font-size: 24px !important; line-height: 1 !important; }
#elementor-popup-modal-3732 .b2b-pp__action .quantity.buttons_added input.qty { flex: none; width: 52px !important; max-width: none !important; height: 46px; margin: 0 !important; text-align: center; font-size: 18px !important; font-weight: 600; }
#elementor-popup-modal-3732 .b2b-pp__action .no-more-units { position: absolute !important; top: calc(100% + 4px); inset-inline-end: 0; font-size: 12px; color: var(--pp-grey); white-space: nowrap; }

.b2b-pp__more { border-top: 1px solid var(--pp-line); border-bottom: 1px solid var(--pp-line); }
.b2b-pp__more-sum { display: flex; align-items: center; justify-content: space-between; min-height: 48px; font-size: 16px; font-weight: 600; cursor: pointer; list-style: none; }
.b2b-pp__more-sum::-webkit-details-marker { display: none; }
.b2b-pp__more-sum::marker { content: ""; }
.b2b-pp__more .b2b-pdp-sec__chev { flex: none; width: 10px; height: 10px; margin-inline-end: 6px; border-right: 2px solid var(--pp-grey); border-bottom: 2px solid var(--pp-grey); transform: rotate(135deg); transition: transform .2s ease; }
.b2b-pp__more[open] .b2b-pdp-sec__chev { transform: translateY(-3px) rotate(45deg); }
.b2b-pp__more-body { padding: 0 0 16px; font-size: 15px; line-height: 1.7; color: #3d3d42; overflow-wrap: anywhere; }
.b2b-pp__more-body img { max-width: 100%; height: auto; border-radius: 8px; }
.b2b-pp__more[open] .b2b-pp__more-body { animation: b2bPdpFade .2s ease both; }
.b2b-pp__link { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; font-size: 15px; font-weight: 600; color: var(--pp-pink-text) !important; text-decoration: none; }
.b2b-pp__link:hover span { text-decoration: underline; text-underline-offset: 3px; }

/* tablets: a narrower modal */
@media (max-width: 1024px) {
    #elementor-popup-modal-3732 .product-popup.b2b-pp-on { gap: 24px !important; padding: 24px 20px 20px !important; }
    .b2b-pp__specs { grid-template-columns: 1fr; }
}

/* phones: a bottom sheet */
@media (max-width: 767px) {
    #elementor-popup-modal-3732 { align-items: flex-end !important; }
    #elementor-popup-modal-3732 .dialog-widget-content {
        width: 100vw !important;
        max-width: 100vw !important;
        border-radius: 20px 20px 0 0 !important;
        margin: 0 !important;
    }
    #elementor-popup-modal-3732 .product-popup.b2b-pp-on {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
        max-height: 92vh !important;
        max-height: 92dvh !important;
        padding: 60px 16px 0 !important; /* the top row is the close button's */
    }
    #elementor-popup-modal-3732 .product-popup.b2b-pp-on .product-img { position: static; max-width: 320px; margin: 0 auto !important; width: 100%; }
    #elementor-popup-modal-3732 .product-popup.b2b-pp-on .product-img .main-image,
    #elementor-popup-modal-3732 .product-popup.b2b-pp-on .product-img .swiper,
    #elementor-popup-modal-3732 .product-popup.b2b-pp-on .product-img .swiper-slide { aspect-ratio: 4 / 3; }
    #elementor-popup-modal-3732 .product-popup.b2b-pp-on .product-img .navigation { display: none; }
    .b2b-pp__title { font-size: 19px !important; }
    #elementor-popup-modal-3732 .b2b-pp .b2b-stickers.b2b-pp__stickers { --b2b-st: 40px; --b2b-st-fs: 10.5px; }
    #elementor-popup-modal-3732 .dialog-close-button { top: 8px !important; left: 8px !important; }
    .b2b-pp__head { padding-inline-end: 0; }
    /* price + stepper stay reachable at the bottom of the sheet */
    .b2b-pp__buy {
        position: sticky; bottom: 0; z-index: 3; order: 10;
        margin: 0 -16px; padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px));
        border: 0; border-top: 1px solid var(--pp-line); border-radius: 0;
        box-shadow: 0 -4px 16px rgba(28, 27, 31, .06);
    }
    .b2b-pp__more { order: 8; }
    .b2b-pp__link { order: 9; }
}
@media (prefers-reduced-motion: reduce) {
    #elementor-popup-modal-3732 .dialog-widget-content.animated { animation: none !important; }
    .b2b-pp *, .b2b-pdp-stickers .b2b-sticker { animation: none !important; transition: none !important; }
}

/* "חזרה לקטגוריה" (button widget 53329e3) removed at the owner's request (2026-09-28): the breadcrumb above the page
   already goes back to the category. Hidden here rather than deleted from the template (no data replay). */
body .elementor-25741 .elementor-element.elementor-element-53329e3 {
    display: none !important;
}