/* =================================================================
   v7-effects.css — HBT v7.1.2 visual upgrade FORCE-OVERRIDE
   -----------------------------------------------------------------
   Hardware-accelerated CSS-only effects:
   • Button microinteractions (hover/active states) — !important
   • Block background gradients + animated meshes
   • Glassmorphism (backdrop-filter) na promo/sticky — !important
   • Card hover effects (translate3d + shadow lift) — !important
   • Image zoom on hover (scale + overflow hidden)
   • Wishlist heart pulse animation
   • Cart added confetti / shake animation
   • Overlay system (modal, drawer, lightbox)
   • Skeleton loaders (placeholder shimmer)

   v7.1.2 changes:
   - !important wszędzie gdzie theme HBT używa !important
   - Fix wishlist selektorów: .add_to_wishlist .hbt-heart-link
     zamiast .yith-wcwl-add-to-wishlist (theme custom wrapping)
   - Force lift na card hover (override theme's transform:none !important)
   - Force shimmer + lift na primary button hover

   @version 7.1.2
   @since   2026-05-26
   ================================================================= */

/* ================================================================
   1) Core tokens & reduced motion
   ================================================================ */
:root {
    --hbt7-ease-out:        cubic-bezier(0.4, 0, 0.2, 1);
    --hbt7-ease-in-out:     cubic-bezier(0.4, 0, 0.6, 1);
    --hbt7-ease-bounce:     cubic-bezier(0.34, 1.56, 0.64, 1);
    --hbt7-fast:            150ms;
    --hbt7-base:            250ms;
    --hbt7-slow:            400ms;

    --hbt7-glass-bg:        rgba(255, 255, 255, 0.72);
    --hbt7-glass-bg-dark:   rgba(20, 30, 25, 0.78);
    --hbt7-glass-blur:      14px;
    --hbt7-glass-border:    rgba(255, 255, 255, 0.15);

    --hbt7-shadow-sm:       0 1px 2px rgba(0,0,0,0.05), 0 1px 3px rgba(0,0,0,0.08);
    --hbt7-shadow-md:       0 4px 6px -1px rgba(0,0,0,0.08), 0 2px 4px -2px rgba(0,0,0,0.06);
    --hbt7-shadow-lg:       0 10px 15px -3px rgba(0,0,0,0.10), 0 4px 6px -4px rgba(0,0,0,0.05);
    --hbt7-shadow-xl:       0 20px 25px -5px rgba(0,0,0,0.10), 0 8px 10px -6px rgba(0,0,0,0.04);

    --hbt7-glow-primary:    0 0 0 4px rgba(124, 179, 66, 0.12), 0 0 30px rgba(124, 179, 66, 0.15);
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* ================================================================
   2) Button microinteractions
   ================================================================ */

/* Primary CTA — bounce-in on hover, glow on focus */
.hbt-btn-primary,
.single-product .single_add_to_cart_button,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.hbt-loop-card__btn,
.hbt-checkout-form button[type="submit"] {
    position: relative;
    overflow: hidden;
    transform: translate3d(0, 0, 0);
    will-change: transform, box-shadow;
    transition:
        transform var(--hbt7-fast) var(--hbt7-ease-out),
        box-shadow var(--hbt7-base) var(--hbt7-ease-out),
        background-color var(--hbt7-fast) var(--hbt7-ease-out) !important;
}

.hbt-btn-primary:hover,
.single-product .single_add_to_cart_button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.hbt-loop-card__btn:hover,
.hbt-loop-card .hbt-loop-card__cta .button:hover,
ul.products li.product .button:hover {
    transform: translate3d(0, -2px, 0) !important;
    box-shadow: var(--hbt7-shadow-lg) !important;
}

.hbt-btn-primary:active,
.single-product .single_add_to_cart_button:active,
.woocommerce a.button.alt:active,
.woocommerce button.button.alt:active,
.hbt-loop-card__btn:active {
    transform: translate3d(0, 0, 0);
    transition-duration: var(--hbt7-fast);
}

.hbt-btn-primary:focus-visible,
.single-product .single_add_to_cart_button:focus-visible {
    outline: none;
    box-shadow: var(--hbt7-glow-primary), var(--hbt7-shadow-md);
}

/* Shimmer effect on primary button hover */
.hbt-btn-primary::before,
.hbt-loop-card__btn::before,
.single-product .single_add_to_cart_button::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(255, 255, 255, 0.25),
        transparent
    );
    transform: translate3d(0, 0, 0);
    transition: left var(--hbt7-slow) var(--hbt7-ease-out);
    pointer-events: none;
}

.hbt-btn-primary:hover::before,
.hbt-loop-card__btn:hover::before,
.single-product .single_add_to_cart_button:hover::before {
    left: 100%;
}

/* ================================================================
   3) Product card hover lift
   v7.1.1: removed overflow:hidden — wishlist heart/badge positioned
   outside card (top:-10px) was being clipped. Keep on __thumb only.
   ================================================================ */
.hbt-loop-card,
.products .product,
.woocommerce ul.products li.product {
    transform: translate3d(0, 0, 0);
    will-change: transform, box-shadow;
    transition:
        transform var(--hbt7-base) var(--hbt7-ease-out),
        box-shadow var(--hbt7-base) var(--hbt7-ease-out);
    border-radius: 12px;
}

/* v7.1.2: !important wymaga aby pokonać theme's `transform:none !important`
   na .hbt-main-wrap ul.products li.product.hbt-loop-card:hover (style.css) */
.hbt-loop-card:hover,
.products .product:hover,
.woocommerce ul.products li.product:hover,
.hbt-main-wrap ul.products li.product.hbt-loop-card:hover {
    transform: translate3d(0, -6px, 0) !important;
    box-shadow: var(--hbt7-shadow-xl) !important;
    border-color: var(--primary-l, #A5D66B) !important;
}

/* Product image zoom inside card */
.hbt-loop-card__thumb,
.woocommerce ul.products li.product a img {
    overflow: hidden;
    border-radius: 8px;
}

.hbt-loop-card img,
.woocommerce ul.products li.product a img {
    transform: translate3d(0, 0, 0) scale(1);
    transition: transform var(--hbt7-slow) var(--hbt7-ease-out);
    will-change: transform;
}

.hbt-loop-card:hover img,
.woocommerce ul.products li.product a:hover img,
.hbt-loop-card:hover .hbt-loop-card__image img {
    transform: translate3d(0, 0, 0) scale(1.06) !important;
}

/* ================================================================
   4) Glassmorphism — promo bar (TYLKO top promo bar)
   v7.1.2: !important żeby pokonać theme's solid green na .promo-bar.
   Promo bar zachowuje brand green ale z glass blur efektem.
   v7.1.20 FIX: REMOVED .hbt-sticky-bar z tej grupy — sticky add-to-cart bar
   miał green gradient ale powinien być clean white/glass (UX clarity).
   ================================================================ */
.promo-bar,
.hbt-glass {
    background: linear-gradient(135deg, rgba(124,179,66,0.92), rgba(85,139,47,0.88)) !important;
    -webkit-backdrop-filter: blur(var(--hbt7-glass-blur)) saturate(180%) !important;
    backdrop-filter: blur(var(--hbt7-glass-blur)) saturate(180%) !important;
    border-bottom: 1px solid rgba(255,255,255,0.15) !important;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

/* v7.1.20: .hbt-sticky-bar — clean white glass dla sticky add-to-cart na single product */
.hbt-sticky-bar {
    background: rgba(255, 255, 255, 0.95) !important;
    -webkit-backdrop-filter: blur(12px) saturate(180%) !important;
    backdrop-filter: blur(12px) saturate(180%) !important;
    border-top: 1px solid rgba(0, 0, 0, 0.06) !important;
    box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.08) !important;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

/* Sticky header with glass on scroll — MOBILE ONLY (header sticky <=991px) */
@media (max-width: 991px) {
    header.site-header.scrolled {
        background: var(--hbt7-glass-bg);
        -webkit-backdrop-filter: blur(var(--hbt7-glass-blur));
        backdrop-filter: blur(var(--hbt7-glass-blur));
        box-shadow: var(--hbt7-shadow-md);
        transition: background var(--hbt7-base), box-shadow var(--hbt7-base);
    }
}

/* Modal / overlay backdrop */
.hbt-overlay,
.mfp-bg,
.fancybox-bg {
    background: rgba(20, 30, 25, 0.65);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    transition: opacity var(--hbt7-base) var(--hbt7-ease-out);
}

.hbt-overlay__content,
.mfp-content,
.fancybox-container {
    background: var(--hbt7-glass-bg);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border: 1px solid var(--hbt7-glass-border);
    border-radius: 16px;
    box-shadow: var(--hbt7-shadow-xl);
    transform: translate3d(0, 0, 0);
    transition: transform var(--hbt7-base) var(--hbt7-ease-bounce);
}

/* ================================================================
   5) Block backgrounds — animated gradient meshes
   ================================================================ */
.hbt-section--gradient {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.hbt-section--gradient::before {
    content: '';
    position: absolute;
    inset: -50%;
    z-index: -1;
    background:
        radial-gradient(circle at 20% 30%, rgba(124, 179, 66, 0.15) 0%, transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(85, 139, 47, 0.12) 0%, transparent 50%),
        radial-gradient(circle at 50% 50%, rgba(139, 195, 74, 0.08) 0%, transparent 70%);
    transform: translate3d(0, 0, 0);
    animation: hbt7-mesh-drift 30s ease-in-out infinite alternate;
    will-change: transform;
}

@keyframes hbt7-mesh-drift {
    0%   { transform: translate3d(0%, 0%, 0) rotate(0deg); }
    50%  { transform: translate3d(2%, -3%, 0) rotate(120deg); }
    100% { transform: translate3d(-2%, 3%, 0) rotate(240deg); }
}

/* Hero section gradient overlay
   v7.1.1: Fixed actual class .hbt-hero-slider (HBT theme uses this for home hero,
   .hbt-hero-uni for brand pages). Removed inert .hbt-hero/.hbt-banner-hero. */
.hbt-hero-slider,
.hbt-hero-uni {
    position: relative;
    isolation: isolate;
}

.hbt-hero-slider::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(
        135deg,
        rgba(124, 179, 66, 0.05) 0%,
        transparent 40%,
        rgba(0, 0, 0, 0.08) 100%
    );
    pointer-events: none;
}

/* ================================================================
   6) Microinteractions — wishlist heart pulse
   ================================================================ */
.yith-wcwl-add-to-wishlist a:hover i,
.yith-wcwl-add-to-wishlist a:hover .yith-wcwl-icon {
    animation: hbt7-heart-pulse 600ms var(--hbt7-ease-bounce);
    color: #e91e63 !important;
}

@keyframes hbt7-heart-pulse {
    0%   { transform: scale(1); }
    25%  { transform: scale(1.3); }
    50%  { transform: scale(0.95); }
    75%  { transform: scale(1.15); }
    100% { transform: scale(1); }
}

/* Cart badge bounce on update */
.cart-contents-count,
.hbt-cart-badge {
    display: inline-block;
    transform-origin: center;
    transition: transform var(--hbt7-base) var(--hbt7-ease-bounce);
}

.cart-contents-count.updated,
.hbt-cart-badge.updated {
    animation: hbt7-badge-bounce 500ms var(--hbt7-ease-bounce);
}

@keyframes hbt7-badge-bounce {
    0%   { transform: scale(1); }
    30%  { transform: scale(1.4); }
    60%  { transform: scale(0.9); }
    100% { transform: scale(1); }
}

/* Add to cart success animation */
.hbt-loop-card__btn.added,
.single_add_to_cart_button.added {
    animation: hbt7-cart-success 800ms var(--hbt7-ease-out);
    background-color: #2e7d32 !important;
}

@keyframes hbt7-cart-success {
    0%   { transform: translate3d(0, 0, 0) scale(1); }
    20%  { transform: translate3d(0, -4px, 0) scale(1.05); }
    40%  { transform: translate3d(0, 0, 0) scale(0.97); }
    60%  { transform: translate3d(0, -2px, 0) scale(1.02); }
    100% { transform: translate3d(0, 0, 0) scale(1); }
}

/* ================================================================
   7) Skeleton loaders (shimmer) for lazy content
   ================================================================ */
.hbt-skeleton {
    background: linear-gradient(
        90deg,
        #f0f0f0 0%,
        #e0e0e0 50%,
        #f0f0f0 100%
    );
    background-size: 200% 100%;
    animation: hbt7-skeleton-shimmer 1.5s linear infinite;
    border-radius: 4px;
}

@keyframes hbt7-skeleton-shimmer {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* ================================================================
   8) Focus rings — accessible + visible
   ================================================================ */
*:focus-visible {
    outline: none;
    box-shadow: var(--hbt7-glow-primary);
    border-radius: 4px;
}

/* ================================================================
   9) Link hover underline animation
   ================================================================ */
.hbt-link,
.entry-content a:not(.button):not(.hbt-btn-primary) {
    position: relative;
    text-decoration: none;
    background-image: linear-gradient(currentColor, currentColor);
    background-position: 0% 100%;
    background-repeat: no-repeat;
    background-size: 0% 1px;
    transition: background-size var(--hbt7-base) var(--hbt7-ease-out);
}

.hbt-link:hover,
.entry-content a:not(.button):not(.hbt-btn-primary):hover {
    background-size: 100% 1px;
}

/* ================================================================
   10) Cat-chip hover (kategorie na home)
   ================================================================ */
.hbt-cat-chip {
    transform: translate3d(0, 0, 0);
    transition:
        transform var(--hbt7-fast) var(--hbt7-ease-out),
        box-shadow var(--hbt7-fast) var(--hbt7-ease-out);
}

.hbt-cat-chip:hover {
    transform: translate3d(0, -2px, 0);
    box-shadow: var(--hbt7-shadow-md);
}

/* ================================================================
   11) Sekcja wishlist HIDDEN on home/blog (Krok E) — v7.1.2 FIX
   Theme HBT używa custom klasy `.add_to_wishlist hbt-heart-link
   hbt-wishlist-action` zamiast standardowej .yith-wcwl-add-to-wishlist.
   ================================================================ */
body.home .hbt-loop-card .add_to_wishlist,
body.home .hbt-loop-card .hbt-heart-link,
body.home .hbt-loop-card .hbt-wishlist-action,
body.home .hbt-loop-card .hbt-loop-card__action--wishlist,
body.home .hbt-loop-card .yith-wcwl-add-to-wishlist,
body.blog .hbt-loop-card .add_to_wishlist,
body.blog .hbt-loop-card .hbt-heart-link,
body.blog .hbt-loop-card .yith-wcwl-add-to-wishlist,
body.page-template-page-homepage .hbt-loop-card .add_to_wishlist,
body.page-template-page-homepage .hbt-loop-card .hbt-heart-link,
body.front-page .hbt-loop-card .add_to_wishlist,
body.front-page .hbt-loop-card .hbt-heart-link {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

/* ================================================================
   12) Off-canvas drawer (cart, wishlist mobile) — glassmorphism
   ================================================================ */
.hbt-drawer {
    position: fixed;
    top: 0;
    right: -400px;
    bottom: 0;
    width: 380px;
    max-width: 92vw;
    background: var(--hbt7-glass-bg);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    box-shadow: -10px 0 30px rgba(0,0,0,0.15);
    z-index: 9998;
    transform: translate3d(0, 0, 0);
    transition: right var(--hbt7-base) var(--hbt7-ease-out);
    will-change: right;
}

.hbt-drawer.open {
    right: 0;
}

/* ================================================================
   13) Lightbox / quick view modal (hardware accelerated)
   ================================================================ */
.hbt-quickview {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--hbt7-base) var(--hbt7-ease-out);
}

.hbt-quickview.open {
    opacity: 1;
    pointer-events: auto;
}

.hbt-quickview__panel {
    max-width: 920px;
    width: 92%;
    max-height: 88vh;
    background: var(--hbt7-glass-bg);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border-radius: 16px;
    box-shadow: var(--hbt7-shadow-xl);
    transform: translate3d(0, 16px, 0) scale(0.95);
    transition: transform var(--hbt7-base) var(--hbt7-ease-bounce);
    overflow: auto;
}

.hbt-quickview.open .hbt-quickview__panel {
    transform: translate3d(0, 0, 0) scale(1);
}

/* ================================================================
   14) Scroll-triggered fade-in (vanilla, no JS needed)
   ================================================================ */
@supports (animation-timeline: view()) {
    .hbt-reveal {
        animation: hbt7-reveal linear both;
        animation-timeline: view();
        animation-range: entry 10% cover 30%;
    }

    @keyframes hbt7-reveal {
        from {
            opacity: 0;
            transform: translate3d(0, 20px, 0);
        }
        to {
            opacity: 1;
            transform: translate3d(0, 0, 0);
        }
    }
}

/* Fallback dla starszych przeglądarek */
@supports not (animation-timeline: view()) {
    .hbt-reveal {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}


/* ================================================================
   v7.1.3) Mobile space optimization — reduce carousel section padding
   na mobile (był 32+32+48=112px/section, teraz 16+16+24=56px).
   ================================================================ */
@media (max-width: 768px) {
    .home-products,
    .home-products-carousel,
    section.home-products {
        padding-top: 16px !important;
        padding-bottom: 16px !important;
        margin-bottom: 24px !important;
    }
    .home-categories,
    .hbt-offer,
    .hbt-industries,
    .hbt-about,
    .hbt-testimonials,
    .hbt-brands-section,
    .hbt-blog,
    .hbt-seo-expandable {
        margin-bottom: 24px !important;
    }
    .hbt-hero-slider {
        margin-bottom: 12px !important;
    }
}


/* ================================================================
   v7.1.3b) Fix "DODAJ DO KOSZYKA" cut-off + heart wrapper visible
   ================================================================ */

/* Fix 1: Heart wrapper kolko placeholder po ukrytym buttonie wishlist.
   Theme HBT wraps heart-link in .hbt-loop-card__heart-wrap span ktore
   ma white circle bg + flex display = puste kolko widoczne.
   Ukrywamy caly wrapper na home/blog. */
body.home .hbt-loop-card .hbt-loop-card__heart-wrap,
body.home .hbt-loop-card .hbt-loop-card__heart,
body.blog .hbt-loop-card .hbt-loop-card__heart-wrap,
body.front-page .hbt-loop-card .hbt-loop-card__heart-wrap,
body.page-template-page-homepage .hbt-loop-card .hbt-loop-card__heart-wrap {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

/* Fix 2: Button "DODAJ DO KOSZYKA" cut-off.
   Theme HBT ma text-transform:uppercase + letter-spacing:0.3px + font-weight:700,
   tekst rozszerza sie do 386px (button 313px = cut). Usuwamy uppercase + reduce padding. */
.hbt-loop-card__btn,
.hbt-loop-card .hbt-loop-card__cta .button,
ul.products li.product .button.hbt-loop-card__btn {
    text-transform: none !important;
    letter-spacing: 0 !important;
    padding: 12px 8px !important;
    font-size: 13px !important;
}

/* Mobile/tablet: jeszcze mniejszy padding zeby tekst sie zmiescil */
@media (max-width: 991px) {
    .hbt-loop-card__btn,
    .hbt-loop-card .hbt-loop-card__cta .button {
        padding: 10px 6px !important;
        font-size: 12px !important;
    }
}


/* ===== v7.1.3c STRONGER button fix ===== */
.hbt-main-wrap .hbt-loop-card .hbt-loop-card__btn,
.hbt-main-wrap ul.products li.product .button.hbt-loop-card__btn,
.home-products-carousel .hbt-loop-card .hbt-loop-card__btn,
body .hbt-loop-card .hbt-loop-card__btn {
    padding-left: 6px !important;
    padding-right: 6px !important;
    padding-top: 11px !important;
    padding-bottom: 11px !important;
    font-size: 12px !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    line-height: 1.2 !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
@media (max-width: 991px) {
    body .hbt-loop-card .hbt-loop-card__btn {
        padding-left: 4px !important;
        padding-right: 4px !important;
        font-size: 11px !important;
    }
}


/* ===== v7.1.3d ULTRA-SPECIFIC button padding override =====
   Theme rule: .hbt-main-wrap ul.products li.product .button { padding:14px } specificity 35.
   We need 36+. Add body prefix + .button class chain. ===== */
body .hbt-main-wrap ul.products li.product .button.hbt-loop-card__btn,
html body .hbt-loop-card .hbt-loop-card__btn,
html body .hbt-loop-card .hbt-loop-card__cta .button {
    padding: 11px 6px !important;
    padding-left: 6px !important;
    padding-right: 6px !important;
    padding-top: 11px !important;
    padding-bottom: 11px !important;
    font-size: 12px !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    line-height: 1.2 !important;
}
@media (max-width: 991px) {
    body .hbt-main-wrap ul.products li.product .button.hbt-loop-card__btn,
    html body .hbt-loop-card .hbt-loop-card__btn {
        padding-left: 4px !important;
        padding-right: 4px !important;
        font-size: 11px !important;
    }
}


/* ===== v7.1.3e MAXIMUM specificity (beats theme 62 → 72) =====
   Theme: .hbt-main-wrap ul.products li.product.hbt-loop-card .hbt-loop-card__cta .button = 62.
   We: same + .hbt-loop-card__btn = 72. ===== */
.hbt-main-wrap ul.products li.product.hbt-loop-card .hbt-loop-card__cta .button.hbt-loop-card__btn,
.hbt-main-wrap ul.products li.product.hbt-loop-card .hbt-loop-card__cta a.button.hbt-loop-card__btn {
    padding: 11px 6px !important;
    padding-left: 6px !important;
    padding-right: 6px !important;
    font-size: 12px !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    line-height: 1.2 !important;
}
@media (max-width: 991px) {
    .hbt-main-wrap ul.products li.product.hbt-loop-card .hbt-loop-card__cta .button.hbt-loop-card__btn {
        padding-left: 4px !important;
        padding-right: 4px !important;
        font-size: 11px !important;
    }
}


/* ===== v7.1.6: RESTORE button ::after icon + force ::before position:absolute =====
   v7.1.3f wcześniej ukrywał ::after (theme ma icon koszyka width:119px co przesuwało tekst).
   v7.1.6: skoro "Do koszyka" jest krótszy (10 chars vs 18), miejsce wraca. Pokazujemy
   ikonę cart PRZED text via flexbox layout + sized icon. */
.hbt-main-wrap ul.products li.product.hbt-loop-card .hbt-loop-card__cta .button.hbt-loop-card__btn::after,
html body .hbt-loop-card .hbt-loop-card__btn::after {
    display: inline-block !important;
    content: "\f07a" !important; /* FA cart-shopping glyph */
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    font-size: 12px !important;
    line-height: 1 !important;
    margin: 0 !important;
    margin-right: 5px !important;
    padding: 0 !important;
    width: auto !important;
    height: auto !important;
    vertical-align: middle !important;
    order: -1 !important; /* pojawia się PRZED text w flex container */
    color: inherit !important;
    position: static !important;
    top: auto !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    transform: none !important;
    /* v7.1.10: OVERRIDE shimmer effect z hbt-v7-chrome-vars-ext.css
       Theme ma .add_to_cart_button::after { opacity:0; position:absolute; left:-40%; }
       jako glass sheen overlay. Musimy zresetować WSZYSTKIE shimmer properties. */
    opacity: 1 !important;
    z-index: auto !important;
    pointer-events: auto !important;
    visibility: visible !important;
    clip: auto !important;
    clip-path: none !important;
}
/* v7.1.10: KRYTYCZNE — theme has @media (hover:none) and (pointer:coarse) { ::after { display:none !important } }
   To kompletnie kasuje cart icon na touchscreen/mobile. Override. */
@media (hover: none) and (pointer: coarse) {
    .hbt-main-wrap ul.products li.product.hbt-loop-card .hbt-loop-card__cta .button.hbt-loop-card__btn::after,
    html body .hbt-loop-card .hbt-loop-card__btn::after {
        display: inline-block !important;
    }
}
.hbt-main-wrap ul.products li.product.hbt-loop-card .hbt-loop-card__cta .button.hbt-loop-card__btn,
html body .hbt-loop-card .hbt-loop-card__btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
}
html body .hbt-loop-card .hbt-loop-card__btn::before {
    position: absolute !important;
    width: 100% !important;
    left: -100% !important;
    top: 0 !important;
}


/* ===== v7.1.3g: Fix nav-bar 7px gap na dole =====
   .site-nav ma height 48px ale .nav-row tylko 41px = 7px pusty czarny pasek.
   Wycentrowac nav-row w nav container przez align-items:center. ===== */
html body .site-nav {
    align-items: center !important;
    min-height: 48px !important;
}
html body .site-nav .nav-row {
    align-items: center !important;
    height: 48px !important;
    min-height: 48px !important;
}
html body .site-nav .nav-cat-trigger,
html body .site-nav .nav-hamburger {
    height: 48px !important;
    min-height: 48px !important;
    display: inline-flex !important;
    align-items: center !important;
}
html body .site-nav .nav-links {
    height: 48px !important;
    align-items: stretch !important;
}
html body .site-nav .nav-links > li {
    height: 48px !important;
    display: flex !important;
    align-items: center !important;
}
html body .site-nav .nav-links > li > a {
    display: flex !important;
    align-items: center !important;
    height: 100% !important;
}
html body .site-nav .nav-shipping {
    height: 48px !important;
    display: flex !important;
    align-items: center !important;
}


/* ===== v7.1.7: Hide duplicate hamburger on mobile =====
   header.php ma 3 hamburger buttons:
   1. .hbt-mobile-hamburger (top header) — primary, otwiera mobile drawer
   2. .nav-hamburger (nav bar) — DUPLIKAT, ten sam target
   3. .search-hamburger (search form) — visible w sticky scroll state
   User widzi 2 hamburgery jednocześnie na mobile = mylące. Ukrywamy nav-hamburger
   bo .hbt-mobile-hamburger jest bardziej widoczny i ma tę samą funkcję.
   Na desktop oba są ukryte przez media query — to wpływa tylko na mobile <=991px. */
@media (max-width: 991px) {
    html body .site-nav .nav-hamburger {
        display: none !important;
    }
}


/* ===== v7.1.9 (2026-05-28): Single product cart button — icon + compact ====
   User feedback: "DODA DO KOSZY" cut-off + brak ikony koszyka przy buttonie.
   Theme ma text-transform:uppercase + letter-spacing:.5px + padding:13px 24px
   co rozszerza "DODAJ DO KOSZYKA" za szeroko. Fix:
   1) Add FA cart icon ::before z order:-1 (PRZED text) — taki sam wzorzec jak loop card
   2) Compact: text-transform:none + letter-spacing:0 + reduce padding
   3) Title case "Dodaj do koszyka" (zachowuje pełen text ale bez UPPERCASE) */
html body .hbt-single-product .sp-cart-form-wrap button.single_add_to_cart_button,
html body .single-product .single_add_to_cart_button,
html body .woocommerce div.product form.cart button.single_add_to_cart_button {
    text-transform: none !important;
    letter-spacing: 0 !important;
    padding: 12px 18px !important;
    font-size: 14px !important;
    gap: 8px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    white-space: nowrap !important;
}
html body .hbt-single-product .sp-cart-form-wrap button.single_add_to_cart_button::before,
html body .single-product .single_add_to_cart_button::before,
html body .woocommerce div.product form.cart button.single_add_to_cart_button::before {
    content: "\f07a" !important; /* FA cart-shopping glyph */
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    font-size: 14px !important;
    line-height: 1 !important;
    margin-right: 4px !important;
    display: inline-block !important;
    vertical-align: middle !important;
    color: inherit !important;
    order: -1 !important;
    position: static !important;
    top: auto !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    width: auto !important;
    height: auto !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    transform: none !important;
    /* v7.1.10: OVERRIDE shimmer/sheen ::before rule
       (.hbt-btn-primary::before, .single-product .single_add_to_cart_button::before ma content:"")
       Musimy nadpisać wszystkie sheen properties żeby cart icon był widoczny. */
    opacity: 1 !important;
    z-index: auto !important;
    pointer-events: auto !important;
    visibility: visible !important;
    clip: auto !important;
    clip-path: none !important;
}
/* v7.1.10: Single product ALSO has ::after shimmer effect — KILL it bo psuje layout buttona */
html body .hbt-single-product .sp-cart-form-wrap--in-price button.single_add_to_cart_button::after,
html body .single-product button.single_add_to_cart_button::after {
    content: none !important;
    display: none !important;
}
/* Mobile: jeszcze compact-er — text moze byc multi-line jak nie pasuje */
@media (max-width: 480px) {
    html body .hbt-single-product .sp-cart-form-wrap button.single_add_to_cart_button {
        padding: 11px 12px !important;
        font-size: 13px !important;
    }
    html body .hbt-single-product .sp-cart-form-wrap button.single_add_to_cart_button::before {
        font-size: 13px !important;
    }
}
/* v7.1.10: Touchscreen — single product ::before display:none override */
@media (hover: none) and (pointer: coarse) {
    html body .hbt-single-product .sp-cart-form-wrap button.single_add_to_cart_button::before,
    html body .single-product .single_add_to_cart_button::before {
        display: inline-block !important;
    }
}


/* ===== v7.1.9: Mobile drawer chevron containment =====
   User feedback: "menu wysuwane ma poprzesuwane strzalki".
   Sidebar mobile drawer .mm-cats > .mm-cat-item ma .mm-expand button z chevron
   na prawej krawędzi. Czasem chevron wystaje za viewport. Reduce flex 56px → 48px
   + ensure padding-right na container. */
@media (max-width: 991px) {
    html body .mobile-menu .mm-cat-item {
        padding-right: 4px !important;
    }
    html body .mobile-menu .mm-expand {
        flex: 0 0 48px !important;
        width: 48px !important;
    }
    html body .mobile-menu .mm-expand i {
        width: 32px !important;
        height: 32px !important;
        font-size: 12px !important;
    }
}


/* ===== v7.1.11: HIDE screen-reader-text na cenach (mobile bug) =====
   User feedback (iOS Safari mobile screenshot):
   "Pierwotna cena wynosiła: 26,00 zł." + "Aktualna cena wynosi: 25,00 zł."
   wyświetlają się jako duży tekst w product card → cały kafelek "posypany".
   Te teksty pochodzą z wc_format_sale_price() jako .screen-reader-text dla
   accessibility (WP a11y). Default WC CSS używa clip:rect(1px,1px,1px,1px) +
   position:absolute + clip-path:inset(50%) ale na iOS Safari w niektórych
   wariantach renderowania (lub gdy parent ma overflow:visible + own positioning)
   te properties się NIE aplikują. FIX: force display:none na .screen-reader-text
   wewnątrz cen produktowych — accessibility utracone TYLKO w tym kontekście
   (screen readers dostaną text z głównej ceny). */
html body .hbt-loop-card__price .screen-reader-text,
html body .hbt-loop-card .price .screen-reader-text,
html body ul.products li.product .price .screen-reader-text,
html body .hbt-product-carousel li.product .price .screen-reader-text,
html body .woocommerce ul.products li.product .price .screen-reader-text,
html body .hbt-single-product .price .screen-reader-text,
html body .hbt-sp-price .screen-reader-text {
    display: none !important;
    visibility: hidden !important;
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(1px, 1px, 1px, 1px) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    pointer-events: none !important;
}