/* B2B Order Tools — order bar, order guide (246), order again, mini-cart drawer accessibility.
   Tokens follow the theme: brand pink #DF1A81 (primary actions, progress), light pink #FBD0E6, ink #1c1b1f,
   pill buttons (radius 100px), Noto Sans Hebrew inherited. Motion: transform/opacity only, 150–300 ms,
   off under prefers-reduced-motion. */

:root {
    --b2b-ot-pink: #DF1A81;
    --b2b-ot-pink-soft: #FBD0E6;
    --b2b-ot-ink: #1c1b1f;
    --b2b-ot-grey: #5f5f66;
    --b2b-ot-line: #e6e3dc;
    --b2b-ot-h: 64px;
    --b2b-ot-safe: env(safe-area-inset-bottom, 0px);
}

.b2b-ot-sr {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

.b2b-ot-money { unicode-bidi: isolate; white-space: nowrap; }

/* ------------------------------------------------------------------ order bar */

.b2b-ot-bar {
    position: fixed;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 9990;
    box-sizing: border-box;
    height: calc(var(--b2b-ot-h) + var(--b2b-ot-safe));
    padding-bottom: var(--b2b-ot-safe);
    background: #fff;
    border-top: 1px solid var(--b2b-ot-line);
    box-shadow: 0 -4px 16px rgba(28, 27, 31, 0.06);
    direction: rtl;
    color: var(--b2b-ot-ink);
    line-height: 1.25;
    transform: translateY(0);
    transition: transform 0.25s ease;
    will-change: transform;
}

.b2b-ot-bar[hidden] { display: none !important; }

/* Progress: a hairline along the top edge, filling from the right (RTL). */
.b2b-ot-bar__track {
    position: absolute;
    top: -1px;
    right: 0;
    left: 0;
    height: 3px;
    background: transparent;
    overflow: hidden;
}

.b2b-ot-bar__fill {
    display: block;
    height: 100%;
    background: var(--b2b-ot-pink);
    transform-origin: right center;
    transition: transform 0.3s ease;
}

.b2b-ot-bar.no-min .b2b-ot-bar__track { display: none; }

.b2b-ot-bar__in {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    max-width: 1320px;
    height: var(--b2b-ot-h);
    margin: 0 auto;
    padding: 0 24px;
}

.b2b-ot-bar__sum {
    display: flex;
    align-items: center;
    gap: 24px;
    min-width: 0;
}

.b2b-ot-bar__row {
    display: flex;
    align-items: baseline;
    gap: 10px;
    min-width: 0;
    line-height: 1.25;
}

.b2b-ot-bar__row > span,
.b2b-ot-bar__min,
.b2b-ot-bar__min > span { line-height: 1.25; }

.b2b-ot-bar__total {
    display: inline-block;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.2;
    transform-origin: center;
}

.b2b-ot-bar__total.is-pulse { animation: b2b-ot-pulse 0.28s ease; }

@keyframes b2b-ot-pulse {
    0% { transform: scale(1); opacity: 1; }
    45% { transform: scale(1.03); opacity: 0.85; }
    100% { transform: scale(1); opacity: 1; }
}

.b2b-ot-bar__count {
    font-size: 14px;
    color: var(--b2b-ot-grey);
    white-space: nowrap;
}

.b2b-ot-bar__min { min-width: 0; }

.b2b-ot-bar__msg {
    font-size: 15px;
    line-height: 1.3;
    color: var(--b2b-ot-ink);
}

.b2b-ot-bar.is-reached .b2b-ot-bar__msg::before {
    content: "";
    display: inline-block;
    width: 14px;
    height: 14px;
    margin-left: 6px;
    vertical-align: -2px;
    background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23DF1A81' d='M9.5 16.2 5.3 12l-1.4 1.4 5.6 5.6 11-11-1.4-1.4z'/%3E%3C/svg%3E");
}

a.b2b-ot-bar__cta,
a.b2b-ot-bar__cta:visited {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 168px;
    height: 44px;
    padding: 0 22px;
    border-radius: 100px;
    background: var(--b2b-ot-pink);
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    transition: opacity 0.15s ease, box-shadow 0.15s ease;
}

a.b2b-ot-bar__cta:hover,
a.b2b-ot-bar__cta:focus { color: #fff; opacity: 0.92; }

a.b2b-ot-bar__cta.is-secondary,
a.b2b-ot-bar__cta.is-secondary:visited {
    background: #fff;
    color: var(--b2b-ot-pink);
    box-shadow: inset 0 0 0 1.5px var(--b2b-ot-pink);
}

a.b2b-ot-bar__cta.is-secondary:hover,
a.b2b-ot-bar__cta.is-secondary:focus { color: var(--b2b-ot-pink); }

/* Collapsed pill (phones, while scrolling down). */
.b2b-ot-pill {
    position: fixed;
    left: 50%;
    bottom: calc(10px + var(--b2b-ot-safe));
    z-index: 9991;
    display: none;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    padding: 0 18px;
    border: 1px solid var(--b2b-ot-line) !important;
    border-radius: 100px !important;
    background: #fff !important;
    color: var(--b2b-ot-ink) !important;
    box-shadow: 0 4px 14px rgba(28, 27, 31, 0.12);
    font: inherit;
    font-size: 14px !important;
    line-height: 1 !important;
    direction: rtl;
    opacity: 0;
    transform: translate(-50%, 8px) scale(0.98);
    pointer-events: none;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.b2b-ot-pill__total { font-weight: 700; }
.b2b-ot-pill__msg { color: var(--b2b-ot-grey); }
.b2b-ot-pill__msg:empty { display: none; }

body.b2b-ot-has-bar {
    padding-bottom: calc(var(--b2b-ot-h) + var(--b2b-ot-safe)) !important;
}

/* Keep Astra's scroll-to-top clear of the bar. */
body.b2b-ot-has-bar #ast-scroll-top {
    bottom: calc(var(--b2b-ot-h) + var(--b2b-ot-safe) + 16px) !important;
}

@media (max-width: 767px) {
    :root { --b2b-ot-h: 60px; }

    .b2b-ot-bar__in { gap: 10px; padding: 0 16px; }
    .b2b-ot-bar__sum { flex-direction: column; align-items: flex-start; gap: 2px; }
    .b2b-ot-bar__total { font-size: 17px; }
    .b2b-ot-bar__count { font-size: 12px; }
    .b2b-ot-bar__count [data-ot="lines"],
    .b2b-ot-bar__count .b2b-ot-bar__dot { display: none; }
    .b2b-ot-bar__msg { font-size: 13px; color: var(--b2b-ot-grey); }
    a.b2b-ot-bar__cta, a.b2b-ot-bar__cta:visited { min-width: 0; padding: 0 16px; font-size: 15px; }

    .b2b-ot-pill { display: inline-flex; }
    .b2b-ot-bar.is-collapsed { transform: translateY(calc(100% + 4px)); }
    .b2b-ot-bar.is-collapsed ~ .b2b-ot-pill {
        opacity: 1;
        transform: translate(-50%, 0) scale(1);
        pointer-events: auto;
    }
}

@media (max-width: 380px) {
    .b2b-ot-bar__row { gap: 6px; }
    a.b2b-ot-bar__cta, a.b2b-ot-bar__cta:visited { font-size: 14px; padding: 0 14px; }
}

/* ------------------------------------------------------------------ shared controls */

.b2b-ot-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 0 20px !important;
    border: 0 !important;
    border-radius: 100px !important;
    background: #fff !important;
    color: var(--b2b-ot-ink) !important;
    box-shadow: inset 0 0 0 1px var(--b2b-ot-line);
    font: inherit;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-decoration: none !important;
    cursor: pointer;
    transition: box-shadow 0.15s ease, opacity 0.15s ease;
}

.b2b-ot-btn:hover { box-shadow: inset 0 0 0 1px #c9c5bc; }

.b2b-ot-btn--primary {
    background: var(--b2b-ot-pink) !important;
    color: #fff !important;
    box-shadow: none;
}

.b2b-ot-btn--primary:hover { opacity: 0.92; box-shadow: none; }
.b2b-ot-btn[disabled] { opacity: 0.55; cursor: default; }

.b2b-ot-bar a:focus-visible,
.b2b-ot-pill:focus-visible,
.b2b-ot-btn:focus-visible,
.b2b-ot-sort__opt:focus-visible,
.b2b-ot-dialog button:focus-visible,
.b2b-ot-dialog input:focus-visible,
.custom-mini-cart .b2b-ot-a11y:focus-visible,
.custom-mini-cart button.mini-cart-close:focus-visible,
.b2b-ot-empty-actions a:focus-visible {
    outline: 2px solid var(--b2b-ot-pink) !important;
    outline-offset: 2px;
}

/* ------------------------------------------------------------------ order guide (246) */

.b2b-ot-guide { direction: rtl; }

.b2b-ot-guide__bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 16px;
    margin: 0 0 20px;
}

.b2b-ot-guide__count {
    margin: 0 !important;
    font-size: 15px;
    color: var(--b2b-ot-grey);
}

.b2b-ot-sort {
    display: inline-flex;
    padding: 2px;
    border-radius: 100px;
    background: #f1eee7;
}

.b2b-ot-sort__opt,
.b2b-ot-sort__opt:visited {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 0 16px;
    border-radius: 100px;
    color: var(--b2b-ot-ink) !important;
    font-size: 14px;
    text-decoration: none !important;
    transition: background-color 0.15s ease, box-shadow 0.15s ease;
}

.b2b-ot-sort__opt.is-on {
    background: #fff;
    box-shadow: 0 1px 3px rgba(28, 27, 31, 0.12);
    font-weight: 600;
}

.b2b-ot-reorder-open { margin-inline-start: auto; flex-direction: column; gap: 0 !important; min-height: 48px; }
.b2b-ot-reorder-open__label { font-size: 15px; }
.b2b-ot-reorder-open__sub { font-size: 12px; font-weight: 400; opacity: 0.9; }

.b2b-ot-guide ul.products li.product .b2b-ot-meta,
.b2b-ot-meta {
    display: block;
    margin: 4px 0 0 !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.45 !important;
    color: var(--b2b-ot-grey) !important;
}

@media (max-width: 400px) {
    .b2b-ot-guide__count-x { display: none; }
}

.b2b-ot-more { display: flex; justify-content: center; margin: 24px 0 8px; }
.b2b-ot-more[hidden] { display: none; }
.b2b-ot-more.is-loading .b2b-ot-more__btn { opacity: 0.6; pointer-events: none; }

.b2b-ot-guide--empty { padding: 32px 0; text-align: center; }
.b2b-ot-guide__empty { margin: 0 auto 16px; max-width: 460px; color: var(--b2b-ot-grey); }

.b2b-ot-guide li.product.b2b-ot-in { animation: b2b-ot-fade 0.25s ease both; }

@keyframes b2b-ot-fade { from { opacity: 0; } to { opacity: 1; } }

@media (max-width: 767px) {
    .b2b-ot-reorder-open { order: -1; width: 100%; margin: 0; }
    .b2b-ot-guide__bar { gap: 10px 12px; margin-bottom: 14px; }
    .b2b-ot-sort { margin-inline-start: auto; }
    .b2b-ot-sort__opt { padding: 0 12px; font-size: 13px; }
    .b2b-ot-guide__count { font-size: 13px; }
}

/* ------------------------------------------------------------------ order-again dialog */

.b2b-ot-overlay {
    position: fixed;
    inset: 0;
    z-index: 100000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    background: rgba(0, 0, 0, 0.45);
    opacity: 0;
    transition: opacity 0.2s ease;
    direction: rtl;
}

.b2b-ot-overlay.is-open { opacity: 1; }

.b2b-ot-dialog {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 640px;
    max-height: min(86dvh, 820px);
    border-radius: 16px;
    background: #fff;
    color: var(--b2b-ot-ink);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.18);
    transform: translateY(8px);
    transition: transform 0.2s ease;
    overflow: hidden;
}

.b2b-ot-overlay.is-open .b2b-ot-dialog { transform: translateY(0); }

.b2b-ot-dialog__head {
    position: relative;
    padding: 18px 20px 14px 64px;
    border-bottom: 1px solid var(--b2b-ot-line);
}

.b2b-ot-dialog__title { margin: 0 !important; font-size: 19px !important; font-weight: 700; line-height: 1.3; }
.b2b-ot-dialog__sub { margin: 4px 0 0 !important; font-size: 14px; color: var(--b2b-ot-grey); }

.b2b-ot-dialog .b2b-ot-x {
    position: absolute;
    top: 10px;
    left: 10px;
    width: 44px;
    height: 44px;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 100px !important;
    background: transparent !important;
    color: var(--b2b-ot-ink) !important;
    cursor: pointer;
}

.b2b-ot-dialog .b2b-ot-x::before,
.b2b-ot-dialog .b2b-ot-x::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 12px;
    width: 20px;
    height: 2px;
    background: #69727d;
    border-radius: 1px;
}

.b2b-ot-dialog .b2b-ot-x::before { transform: rotate(45deg); }
.b2b-ot-dialog .b2b-ot-x::after { transform: rotate(-45deg); }

.b2b-ot-dialog__body {
    flex: 1 1 auto;
    min-height: 120px;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 4px 20px;
}

.b2b-ot-lines { margin: 0 !important; padding: 0 !important; list-style: none !important; }

.b2b-ot-line {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    margin: 0 !important;
    padding: 12px 0;
    border-bottom: 1px solid #f0ede6;
}

.b2b-ot-line:last-child { border-bottom: 0; }

.b2b-ot-line__img { width: 48px; height: 48px; border-radius: 8px; object-fit: contain; background: #faf8f3; }

.b2b-ot-line__name {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.35;
}

.b2b-ot-line__meta { margin-top: 2px; font-size: 12px; color: var(--b2b-ot-grey); line-height: 1.4; }
.b2b-ot-line__note { margin-top: 2px; font-size: 12px; color: var(--b2b-ot-ink); }
.b2b-ot-line.is-zero .b2b-ot-line__img,
.b2b-ot-line.is-zero .b2b-ot-line__text { opacity: 0.5; }

.b2b-ot-step {
    display: inline-flex;
    align-items: center;
    border-radius: 100px;
    box-shadow: inset 0 0 0 1px var(--b2b-ot-line);
    direction: ltr;
}

.b2b-ot-step button {
    width: 44px;
    height: 44px;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 100px !important;
    background: transparent !important;
    color: var(--b2b-ot-ink) !important;
    font-size: 20px !important;
    line-height: 1 !important;
    cursor: pointer;
}

.b2b-ot-step button[disabled] { opacity: 0.3; cursor: default; }

.b2b-ot-step input {
    width: 48px !important;
    height: 36px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    text-align: center;
    font-size: 16px !important;
    font-weight: 600;
    color: var(--b2b-ot-ink);
    -moz-appearance: textfield;
}

.b2b-ot-step input::-webkit-outer-spin-button,
.b2b-ot-step input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.b2b-ot-skipped { margin: 8px 0 12px; font-size: 14px; }
.b2b-ot-skipped summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; color: var(--b2b-ot-grey); }
.b2b-ot-skipped li { padding: 6px 0; list-style: none; font-size: 13px; }
.b2b-ot-skipped ul { margin: 0 !important; padding: 0 !important; }
.b2b-ot-skipped .b2b-ot-reason { color: var(--b2b-ot-grey); }

.b2b-ot-dialog__foot {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 20px calc(12px + var(--b2b-ot-safe));
    border-top: 1px solid var(--b2b-ot-line);
    background: #fff;
}

.b2b-ot-dialog__summary { margin-inline-end: auto; font-size: 14px; color: var(--b2b-ot-grey); }
.b2b-ot-dialog__msg { padding: 16px 0; font-size: 15px; line-height: 1.5; }
.b2b-ot-dialog__msg strong { font-weight: 700; }
.b2b-ot-loading { padding: 32px 0; text-align: center; color: var(--b2b-ot-grey); }

@media (max-width: 767px) {
    .b2b-ot-overlay { align-items: flex-end; padding: 0; }
    .b2b-ot-dialog { max-width: none; max-height: 92dvh; border-radius: 16px 16px 0 0; transform: translateY(24px); }
    .b2b-ot-dialog__head { padding: 16px 16px 12px 60px; }
    .b2b-ot-dialog__body { padding: 0 16px; }
    .b2b-ot-dialog__foot { flex-wrap: wrap; padding-left: 16px; padding-right: 16px; }
    .b2b-ot-dialog__summary { width: 100%; }
    .b2b-ot-dialog__foot .b2b-ot-btn { flex: 1 1 0; }
    /* Phones: name across the top, price line and stepper side by side under it. */
    .b2b-ot-line { grid-template-columns: 44px minmax(0, 1fr) auto; column-gap: 10px; row-gap: 4px; }
    .b2b-ot-line__img { width: 44px; height: 44px; grid-row: 1 / span 3; align-self: start; }
    .b2b-ot-line__text { display: contents; }
    .b2b-ot-line__name { grid-column: 2 / 4; grid-row: 1; }
    .b2b-ot-line__meta { grid-column: 2; grid-row: 2; }
    .b2b-ot-line__note { grid-column: 2; grid-row: 3; }
    .b2b-ot-line .b2b-ot-step { grid-column: 3; grid-row: 2 / span 2; justify-self: end; }
    .b2b-ot-line.is-zero .b2b-ot-line__name,
    .b2b-ot-line.is-zero .b2b-ot-line__meta { opacity: 0.5; }
}

body.b2b-ot-modal-open { overflow: hidden; }

/* ------------------------------------------------------------------ mini-cart drawer */

/* Closed drawer: out of the tab order and hidden from screen readers once it has slid away. */
.custom-mini-cart-wrapper {
    transition: transform 0.3s ease, visibility 0s linear 0.3s;
}

.custom-mini-cart-wrapper:not(.open) { visibility: hidden; }

.custom-mini-cart-wrapper.open {
    visibility: visible;
    transition: transform 0.3s ease, visibility 0s;
}

.custom-mini-cart-header button.mini-cart-close {
    position: absolute;
    left: 3px;
    top: 13px;
    width: 44px;
    height: 44px;
    min-height: 0;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 100px !important;
    background: transparent !important;
    box-shadow: none !important;
    color: inherit !important;
    cursor: pointer;
}

.custom-mini-cart-header button.mini-cart-close::before,
.custom-mini-cart-header button.mini-cart-close::after {
    left: 7px;
    width: 30px;
}

.impersonating .custom-mini-cart-header button.mini-cart-close { top: 53px; }

.custom-mini-cart .mini-cart-empty[hidden] { display: none !important; }

.custom-mini-cart .mini-cart-empty.b2b-ot-a11y {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
}

.b2b-ot-empty-actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    margin-top: 16px;
}

.b2b-ot-empty-actions .b2b-ot-btn { min-width: 220px; }

@media (prefers-reduced-motion: reduce) {
    .b2b-ot-bar,
    .b2b-ot-bar__fill,
    .b2b-ot-pill,
    .b2b-ot-overlay,
    .b2b-ot-dialog,
    .custom-mini-cart-wrapper,
    .custom-mini-cart-wrapper.open { transition: none !important; }
    .b2b-ot-bar__total.is-pulse,
    .b2b-ot-guide li.product.b2b-ot-in { animation: none !important; }
}


/* While the header search is open (body.b2bs-open; on phones it is a full-width sheet down to the screen bottom),
   the bar and pill step aside: they sat above the search scrim and covered the last result rows. */
body.b2bs-open .b2b-ot-bar,
body.b2bs-open .b2b-ot-pill {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition: opacity 0.15s ease, visibility 0s linear 0.15s;
}

@media (prefers-reduced-motion: reduce) {
    body.b2bs-open .b2b-ot-bar,
    body.b2bs-open .b2b-ot-pill {
        transition: none;
    }
}