.pswp__top-bar {
    top: 70px !important;
    background-color: #000 !important;
}
.woocommerce ul#shipping_method li label {
    font-size: 15px !important;
}

/* --- Shop pagination, bottom of the category / shop archives ----------------
   rtl.css floats nav.woocommerce-pagination, and it also resets clear on every
   div inside the archive article (.woocommerce-page .site-main article.page div
   { clear: none !important }), which beats .category-bottom-content{clear:both}.
   So the block after the pagination started at the float's top edge instead of
   below it: on mobile, where the numbers wrap onto two rows, its border-top line
   was drawn straight through the page numbers.
   Fix: take the pagination out of the float, and keep the clear as a backstop.
   The class is repeated in the selectors on purpose - oc-style.css loads before
   rtl.css, so these have to win on specificity rather than on order. */
.woocommerce-pagination.woocommerce-pagination {
    float: none;
    clear: both;
    display: block;
    width: 100%;
    text-align: center;
}
.woocommerce-page .site-main article.page div.category-bottom-content {
    clear: both !important;
}

/* On phones nine 40px bubbles no longer fit on one line, so the prev/next arrow
   dropped to a line of its own. Lay the list out as a flex row and derive the
   bubble size from the available width (10 per row), so a normal pagination fits
   on a single line and a long one wraps evenly instead of orphaning the arrow. */
@media screen and (max-width: 767px) {
    .woocommerce nav.woocommerce-pagination.woocommerce-pagination ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        gap: 5px;
    }
    .woocommerce nav.woocommerce-pagination.woocommerce-pagination ul::after {
        content: none;
    }
    .woocommerce nav.woocommerce-pagination.woocommerce-pagination ul li {
        flex: 0 0 calc((100% - 45px) / 10);
        max-width: 40px;
    }
    .woocommerce nav.woocommerce-pagination.woocommerce-pagination ul li a,
    .woocommerce nav.woocommerce-pagination.woocommerce-pagination ul li span {
        width: 100%;
        height: auto;
        aspect-ratio: 1;
        line-height: 1;
        margin: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 14px;
    }
}

/* --- Checkout upsell (WooCommerce Checkout Upsell Funnel): show the full product name -----
   The plugin clamps the upsell product title to 2 lines (-webkit-line-clamp: 2, 17px), so long
   names such as "חידות מתגרדות לארוחת העשר לגילאי 4-6" lose their last words. Allow up to 4 lines
   and a slightly taller line so the whole name is visible. TKT-1765, 2026-09-09. */
.viwcuf-checkout-funnel-container .vi-wcuf-us-product .vi-wcuf-us-product-desc .woocommerce-loop-product__title {
    -webkit-line-clamp: 4;
    line-height: 18px !important;
    white-space: normal;
}

/* --- Checkout, "הפרטים שלך": gap between checkbox and its text --------------------------
   rtl.css resets .woocommerce form .form-row .input-checkbox to margin:0. Labels whose text
   is wrapped in a <span> ("יצירת חשבון...", "משלוח לכתובת אחרת?") then touch the box; the gift
   checkboxes only looked fine because their text starts with a space. Restore the gap on the
   text side (left, RTL). TKT-1765, 2026-09-17. */
.woocommerce-checkout #customer_details label.woocommerce-form__label-for-checkbox input[type="checkbox"] {
    margin-left: 8px;
}

/* --- Mobile "added to cart" popup (YITH): the related products could not be scrolled into view --
   style.css forces .yith-wacp-content to height:200% and, below 768px, .yith-wacp-wrapper to
   height:100% (capped at 700px by the plugin), and turns the related list into its own 300px
   scroll box with scroll-snap inside the popup's scroller. The content grows past the box, the
   box can run below the bottom of shorter phones, and the short inner box hides the "הוספה לסל"
   buttons of the bottom row. On phones give the box a height that fits the screen, centre it,
   drop the inner scroll box, and let the whole popup content scroll as one.
   TKT-1765, 2026-09-17. */
@media screen and (max-width: 767px) {
    #yith-wacp-popup .yith-wacp-wrapper {
        height: min(calc(100vh - 120px), 700px) !important;
        height: min(calc(100dvh - 120px), 700px) !important;
        top: calc((100vh - min(calc(100vh - 120px), 700px)) / 2) !important;
        top: calc((100dvh - min(calc(100dvh - 120px), 700px)) / 2) !important;
    }
    #yith-wacp-popup .yith-wacp-main .yith-wacp-content {
        height: 100% !important;
    }
    #yith-wacp-popup .yith-wacp-related .yith-wacp-related-products {
        height: auto;
        overflow-y: visible;
        scroll-snap-type: none;
    }
}

/* TKT 3246815532 - home category tiles: uniform height for every tile regardless of image shape (old tiles are 353x162) */
.home-categories ul li a img{aspect-ratio: 353 / 162; object-fit: cover; height: auto;}