/*
Theme Name: Zooboxi Child
Template: astra
Description: Zooboxi Pet Store - Premium Design matching Zid
Version: 3.3.0
Text Domain: zooboxi-child
*/

/* ═══════════ CSS VARIABLES ═══════════ */
:root {
    --z-primary: #429d9c;
    --z-primary-dark: #2d7a79;
    --z-secondary: #d48644;
    --z-header-bg: #e6f2e6;
    --z-footer-bg: #e7f2e4;
    --z-announcement-bg: #f7ddc7;
    --z-text: #2c3e2d;
    --z-icons: #d46856;
}

/* ═══════════ STICKY HEADER ═══════════ */
.zooboxi-site-header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 9999 !important;
    transition: box-shadow 0.3s ease !important;
}

.zooboxi-site-header.is-stuck {
    box-shadow: 0 2px 20px rgba(0,0,0,0.08) !important;
}

/* ═══════════ GLOBAL ═══════════ */
body {
    font-family: 'El Messiri', 'Tajawal', sans-serif !important;
}

/* ═══════════ EXACT ZID HEADER ═══════════ */
.zooboxi-site-header {
    position: relative;
    width: 100%;
    z-index: 999;
}

/* Announcement Bar */
.zooboxi-announcement-bar {
    background: var(--z-announcement-bg);
    overflow: hidden;
    padding: 8px 0;
    font-size: 13px;
    font-weight: 600;
    color: #5a3a1a;
}
.zooboxi-marquee { width: 100%; overflow: hidden; }
.zooboxi-marquee__content {
    display: flex; gap: 80px; white-space: nowrap;
    animation: zbx-marquee 20s linear infinite;
}
@keyframes zbx-marquee { 0% { transform: translateX(100%); } 100% { transform: translateX(-100%); } }

/* Main Header */
.zooboxi-header-main {
    background-color: var(--z-header-bg) !important;
    padding: 10px 0 !important;
    position: relative !important;
    z-index: 10 !important;
    border-bottom: 2px solid rgba(0, 0, 0, 0.05) !important;
}

/* Header Row Layout */
.zbx-header-row {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 16px !important;
    gap: 10px !important;
    flex-wrap: nowrap !important;
}
.zbx-header-right,
.zbx-header-left {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    flex-shrink: 0 !important;
}
.zbx-header-center {
    flex-shrink: 1 !important;
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
.zbx-logo {
    height: 55px !important;
    max-height: 55px !important;
    width: auto !important;
    display: block !important;
    object-fit: contain !important;
}

/* Icons and buttons clean reset */
.icon-btn {
    background: transparent !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s, opacity 0.2s;
    text-decoration: none !important;
}
.icon-btn:hover {
    opacity: 0.85;
    transform: scale(1.05);
}
.icon-btn svg {
    width: 22px;
    height: 22px;
    display: block;
    stroke: var(--z-icons) !important;
}

/* Location Button */
.zbx-location-btn {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
}
.zbx-city-text {
    font-size: 12px;
    font-weight: 700;
    color: var(--z-icons, #d46856);
    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Cart Badge */
.cart-btn {
    position: relative !important;
}
.cart-btn .count {
    position: absolute !important;
    top: -5px !important;
    right: -5px !important;
    background: #000 !important;
    color: #fff !important;
    border-radius: 50% !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    width: 16px !important;
    height: 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
}

/* Language Wrapper */
.zooboxi-lang-wrapper {
    position: relative;
    display: inline-block;
}

/* ═══ CUSTOM MOBILE DRAWER ═══ */
.zbx-drawer-overlay {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.45);
    backdrop-filter: blur(4px);
    z-index: 100000;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.35s, visibility 0.35s;
}
.zbx-drawer-overlay.open {
    opacity: 1;
    visibility: visible;
}
.zbx-drawer {
    position: fixed;
    top: 0;
    right: -320px;
    width: 300px;
    max-width: 85vw;
    height: 100%;
    background: #fff;
    z-index: 100001;
    transition: right 0.35s cubic-bezier(0.16, 1, 0.3, 1);
    display: flex;
    flex-direction: column;
    box-shadow: -4px 0 24px rgba(0,0,0,0.1);
}
.zbx-drawer.open {
    right: 0;
}
.zbx-drawer-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    border-bottom: 1px solid #f0f0f0;
}
.zbx-drawer-logo {
    height: 42px;
}
.zbx-drawer-close {
    background: #f5f5f5 !important;
    border: none !important;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    font-size: 18px;
    color: #666;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
}
.zbx-drawer-close:hover {
    background: #eee !important;
    color: #333;
}
.zbx-drawer-body {
    flex: 1;
    overflow-y: auto;
    padding: 12px 0;
}
.zbx-drawer-section {
    padding: 8px 20px;
}
.zbx-drawer-section-title {
    font-size: 13px;
    font-weight: 700;
    color: #999;
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.zbx-drawer-link {
    display: block;
    padding: 12px 16px;
    color: #333 !important;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none !important;
    border-radius: 10px;
    transition: background 0.2s;
    font-family: 'El Messiri', sans-serif;
}
.zbx-drawer-link:hover {
    background: #f5f7f5;
    color: var(--z-primary, #43978f) !important;
}
.zbx-drawer-divider {
    height: 1px;
    background: #f0f0f0;
    margin: 8px 20px;
}
.zbx-drawer-cats {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.zbx-drawer-cat {
    display: inline-block;
    padding: 6px 14px;
    background: #f5f7f5;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
    color: #333 !important;
    text-decoration: none !important;
    transition: all 0.2s;
}
.zbx-drawer-cat:hover {
    background: var(--z-primary, #43978f);
    color: #fff !important;
}
.zbx-drawer-langs {
    display: flex;
    gap: 10px;
}
.zbx-drawer-langs a {
    padding: 8px 20px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 600;
    color: #555 !important;
    text-decoration: none !important;
    background: #f5f7f5;
    transition: all 0.2s;
}
.zbx-drawer-langs a:hover,
.zbx-drawer-langs a.active {
    background: var(--z-primary, #43978f);
    color: #fff !important;
}
.zbx-drawer-footer {
    border-top: 1px solid #f0f0f0;
    padding: 12px 20px;
    display: flex;
    gap: 10px;
}
.zbx-drawer-footer-btn {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 12px;
    border-radius: 12px;
    background: #f5f7f5;
    font-size: 14px;
    font-weight: 600;
    color: #333 !important;
    text-decoration: none !important;
    transition: all 0.2s;
}
.zbx-drawer-footer-btn:hover {
    background: var(--z-primary, #43978f);
    color: #fff !important;
}

/* ═══ MOBILE RESPONSIVE HEADER ═══ */
@media (max-width: 768px) {
    .zbx-header-row {
        padding: 0 12px !important;
        gap: 8px !important;
    }
    .zbx-header-right,
    .zbx-header-left {
        gap: 8px !important;
    }
    .zbx-logo {
        height: 42px !important;
        max-height: 42px !important;
    }
    .icon-btn svg {
        width: 20px !important;
        height: 20px !important;
    }
    .zbx-city-text {
        font-size: 10px !important;
        max-width: 70px !important;
    }
    .zbx-hide-mobile {
        display: none !important;
    }
    .zooboxi-header-main {
        padding: 8px 0 !important;
    }
    .zooboxi-announcement-bar {
        padding: 5px 0 !important;
        font-size: 11px !important;
    }
    .cart-btn .count {
        width: 14px !important;
        height: 14px !important;
        font-size: 8px !important;
    }
}

@media (max-width: 480px) {
    .zbx-header-row {
        padding: 0 8px !important;
        gap: 4px !important;
    }
    .zbx-header-right,
    .zbx-header-left {
        gap: 6px !important;
    }
    .zbx-logo {
        height: 36px !important;
        max-height: 36px !important;
    }
    .icon-btn svg {
        width: 18px !important;
        height: 18px !important;
    }
    .zbx-city-text {
        display: none !important;
    }
    .zooboxi-lang-wrapper {
        display: none !important;
    }
}

/* ═══ MOBILE LOCATION INFO BAR ═══ */
.zbx-mobile-info-bar {
    display: none; /* hidden on desktop */
    background: var(--z-header-bg, #fdf6f0);
    border-bottom: 1px solid rgba(0,0,0,0.06);
    padding: 6px 12px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.zbx-mobile-info-bar::-webkit-scrollbar { display: none; }

@media (max-width: 768px) {
    .zbx-mobile-info-bar {
        display: flex !important;
        align-items: center !important;
        gap: 6px !important;
        white-space: nowrap !important;
    }
}
.zbx-info-item {
    display: flex;
    align-items: center;
    gap: 3px;
    flex-shrink: 0;
}
.zbx-info-icon {
    font-size: 11px;
    line-height: 1;
}
.zbx-info-text {
    font-size: 10px;
    font-weight: 600;
    color: #555;
    font-family: 'El Messiri', sans-serif;
}
.zbx-info-sep {
    color: #ccc;
    font-size: 10px;
    flex-shrink: 0;
}
.zbx-info-express-on .zbx-info-text {
    color: #27ae60;
    font-weight: 700;
}
.zbx-info-standard .zbx-info-text {
    color: #e67e22;
    font-weight: 700;
}
.zbx-info-shipping .zbx-info-text,
.zbx-info-express-off .zbx-info-text {
    color: #7f8c8d;
    font-weight: 700;
}

/* ═══ MOBILE CATEGORIES SLIDER ═══ */
@media (max-width: 768px) {
    .zbx-animals-nav {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        scroll-snap-type: x mandatory !important;
        gap: 14px !important;
        padding: 0 16px 12px !important;
        margin: 16px auto 20px !important;
        scrollbar-width: none !important;
        justify-content: flex-start !important;
    }
    .zbx-animals-nav::-webkit-scrollbar {
        display: none !important;
    }
    .zbx-animal-card {
        flex-shrink: 0 !important;
        width: 90px !important;
        scroll-snap-align: start !important;
    }
    .zbx-animal-card__img-wrap {
        width: 80px !important;
        height: 80px !important;
        margin-bottom: 8px !important;
    }
    .zbx-animal-card__name {
        font-size: 12px !important;
    }
}

/* ═══ PRODUCT CARDS — PREMIUM UNIFIED STYLE (Homepage Blocks) ═══ */

/* ── CRITICAL: Override WooCommerce core inline-block on link/image ── */
.wc-block-grid__product .wc-block-grid__product-link,
.wc-block-grid__product .wc-block-grid__product-image {
    display: block !important;
    width: 100% !important;
}

/* ── CRITICAL: Override WooCommerce core margin: 0 auto on sub-elements ── */
.wc-block-grid__product .wc-block-grid__product-add-to-cart,
.wc-block-grid__product .wc-block-grid__product-onsale,
.wc-block-grid__product .wc-block-grid__product-price,
.wc-block-grid__product .wc-block-grid__product-rating {
    margin: 0 !important;
}

/* Card Container */
.wc-block-grid__product {
    background: #ffffff !important;
    border-radius: 20px !important;
    border: 1px solid rgba(226, 232, 224, 0.7) !important;
    box-shadow: 0 2px 12px rgba(44, 62, 45, 0.04) !important;
    overflow: hidden !important;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    position: relative !important;
    width: 100% !important;
    max-width: 100% !important;
    text-align: center !important;
}

.wc-block-grid__product:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 16px 40px rgba(44, 62, 45, 0.10), 0 6px 16px rgba(66, 157, 156, 0.06) !important;
    border-color: rgba(66, 157, 156, 0.25) !important;
}

/* Product Link Wrapper (wraps image + title) */
.wc-block-grid__product > .wc-block-grid__product-link {
    display: flex !important;
    flex-direction: column !important;
    text-decoration: none !important;
    color: inherit !important;
    flex: 1 !important;
    width: 100% !important;
}

/* Product Image Area */
.wc-block-grid__product-image {
    position: relative !important;
    overflow: hidden !important;
    border-radius: 0 !important;
    aspect-ratio: 1/1 !important;
    background: linear-gradient(180deg, #fafbfa 0%, #f3f5f2 100%) !important;
    width: 100% !important;
}

.wc-block-grid__product-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    padding: 16px !important;
    box-sizing: border-box !important;
    transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    background: transparent !important;
    display: block !important;
    max-width: 100% !important;
}

.wc-block-grid__product:hover .wc-block-grid__product-image img {
    transform: scale(1.06) !important;
}

/* Image subtle overlay on hover */
.wc-block-grid__product-image::after {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(180deg, transparent 60%, rgba(44, 62, 45, 0.03) 100%) !important;
    pointer-events: none !important;
    transition: opacity 0.3s ease !important;
    opacity: 0 !important;
}

.wc-block-grid__product:hover .wc-block-grid__product-image::after {
    opacity: 1 !important;
}

/* Sale Badge */
.wc-block-grid__product .wc-block-grid__product-onsale {
    position: absolute !important;
    top: 12px !important;
    left: 12px !important;
    right: auto !important;
    background: linear-gradient(135deg, #ff6b6b, #ee5a24) !important;
    color: #fff !important;
    font-family: 'Tajawal', sans-serif !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    padding: 4px 12px !important;
    border-radius: 10px !important;
    z-index: 3 !important;
    box-shadow: 0 4px 14px rgba(238, 90, 36, 0.35) !important;
    animation: zbx-sale-shimmer 3s ease-in-out infinite !important;
    border: none !important;
    line-height: 1.5 !important;
    letter-spacing: 0.3px !important;
    min-height: auto !important;
    min-width: auto !important;
    margin: 0 !important;
    width: auto !important;
}

/* Product Title */
.wc-block-grid__product-title {
    font-family: 'Tajawal', 'El Messiri', sans-serif !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #1a2e1c !important;
    line-height: 1.5 !important;
    padding: 12px 14px 4px !important;
    margin: 0 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    min-height: 40px !important;
    transition: color 0.3s ease !important;
    text-align: right !important;
    word-break: break-word !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.wc-block-grid__product:hover .wc-block-grid__product-title {
    color: var(--z-primary-dark) !important;
}

/* Price */
.wc-block-grid__product .wc-block-grid__product-price.price {
    padding: 2px 14px 8px !important;
    font-family: 'Tajawal', sans-serif !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    color: var(--z-primary) !important;
    direction: rtl !important;
    text-align: right !important;
    line-height: 1.4 !important;
    margin: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.wc-block-grid__product-price del {
    color: #bbb !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    text-decoration: line-through !important;
    opacity: 0.7 !important;
}

.wc-block-grid__product-price ins {
    text-decoration: none !important;
    color: var(--z-primary) !important;
    font-weight: 800 !important;
    background: none !important;
}

/* Add to Cart Button Wrapper */
.wc-block-grid__product .wc-block-grid__product-add-to-cart,
.wc-block-grid__product .wp-block-button.wc-block-grid__product-add-to-cart {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    margin-top: auto !important;
    padding: 4px 14px 14px !important;
    box-sizing: border-box !important;
    white-space: normal !important;
}

/* Add to Cart Button Link */
.wc-block-grid__product-add-to-cart .wp-block-button__link,
.wc-block-grid__product-add-to-cart > a {
    display: block !important;
    width: 100% !important;
    background: var(--z-primary) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 10px 16px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-align: center !important;
    transition: all 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    font-family: 'Tajawal', 'El Messiri', sans-serif !important;
    cursor: pointer !important;
    text-decoration: none !important;
    letter-spacing: 0.3px !important;
    box-shadow: 0 4px 14px rgba(66, 157, 156, 0.2) !important;
    box-sizing: border-box !important;
    line-height: 1.4 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.wc-block-grid__product-add-to-cart .wp-block-button__link:hover,
.wc-block-grid__product-add-to-cart > a:hover {
    background: var(--z-primary-dark) !important;
    box-shadow: 0 6px 22px rgba(66, 157, 156, 0.35) !important;
    transform: translateY(-2px) !important;
}

.wc-block-grid__product-add-to-cart .wp-block-button__link:active,
.wc-block-grid__product-add-to-cart > a:active {
    transform: translateY(0) scale(0.98) !important;
    box-shadow: 0 2px 8px rgba(66, 157, 156, 0.2) !important;
}

/* Rating - hide */
.wc-block-grid__product-rating {
    display: none !important;
}

/* ═══ HOMEPAGE PRODUCT GRID (Desktop) ═══ */
.wc-block-grid__products {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 20px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
}

/* Ensure grid items fill their cells */
.wc-block-grid__products > .wc-block-grid__product {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: none !important;
    margin: 0 !important;
}

/* ═══ MOBILE PRODUCT SLIDER ═══ */
@media (max-width: 768px) {
    .wc-block-grid__products {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        scroll-snap-type: x mandatory !important;
        gap: 12px !important;
        padding: 0 16px 16px !important;
        scrollbar-width: none !important;
        grid-template-columns: none !important;
    }
    .wc-block-grid__products::-webkit-scrollbar {
        display: none !important;
    }
    .wc-block-grid__products > .wc-block-grid__product {
        flex: 0 0 44vw !important;
        width: 44vw !important;
        max-width: 44vw !important;
        min-width: 44vw !important;
        scroll-snap-align: start !important;
        margin: 0 !important;
        border-radius: 16px !important;
    }
    .wc-block-grid__product-image {
        aspect-ratio: 1/1 !important;
        height: auto !important;
    }
    .wc-block-grid__product-image img {
        padding: 10px !important;
    }
    .wc-block-grid__product-title {
        font-size: 11px !important;
        padding: 8px 10px 2px !important;
        min-height: 32px !important;
    }
    .wc-block-grid__product .wc-block-grid__product-price.price {
        padding: 0 10px 4px !important;
        font-size: 13px !important;
    }
    .wc-block-grid__product .wc-block-grid__product-add-to-cart,
    .wc-block-grid__product .wp-block-button.wc-block-grid__product-add-to-cart {
        padding: 4px 10px 10px !important;
    }
    .wc-block-grid__product-add-to-cart .wp-block-button__link,
    .wc-block-grid__product-add-to-cart > a {
        font-size: 11px !important;
        padding: 8px 10px !important;
        border-radius: 10px !important;
    }

    /* Section headings tighter on mobile */
    .wp-block-heading.has-text-align-center {
        font-size: 20px !important;
        margin-bottom: 12px !important;
    }
}

@media (max-width: 480px) {
    .wc-block-grid__products > .wc-block-grid__product {
        flex: 0 0 42vw !important;
        width: 42vw !important;
        max-width: 42vw !important;
        min-width: 42vw !important;
    }
}

/* Language Dropdown Selector */
.zooboxi-lang-dropdown {
    display: none;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    background-color: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(44, 62, 45, 0.12);
    padding: 6px 0;
    min-width: 100px;
    z-index: 9999;
    margin-top: 10px;
}
.zooboxi-lang-dropdown.show {
    display: block;
}
.zooboxi-lang-dropdown a {
    display: block;
    padding: 8px 16px;
    color: var(--z-text) !important;
    font-size: 13px;
    text-decoration: none !important;
    text-align: center;
    font-weight: 500;
    transition: background 0.2s, color 0.2s;
}
.zooboxi-lang-dropdown a:hover {
    background-color: #f3f7f3;
    color: var(--z-icons) !important;
}
.zooboxi-lang-dropdown a.active {
    color: var(--z-icons) !important;
    font-weight: 700;
}

/* Location Selector Style adjustments */
.location-selector-btn {
    border-radius: 20px !important;
    padding: 6px 12px !important;
    background-color: rgba(212, 104, 86, 0.05) !important;
    border: 1px solid rgba(212, 104, 86, 0.12) !important;
    transition: background-color 0.2s, transform 0.2s !important;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.location-selector-btn:hover {
    background-color: rgba(212, 104, 86, 0.1) !important;
    transform: translateY(-1px) !important;
}
.location-selector-btn .selected-city-text {
    font-size: 12px !important;
    font-weight: 600 !important;
    color: var(--z-icons) !important;
    max-width: 140px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    vertical-align: middle;
}

/* Perfect Horizontal Centering Layout */
.zooboxi-header-main .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}
.header-right {
    flex: 1;
    display: flex;
    justify-content: flex-start;
    gap: 20px;
    align-items: center;
}
.header-center {
    flex: 0 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
}
.header-left {
    flex: 1;
    display: flex;
    justify-content: flex-end;
    gap: 20px;
    align-items: center;
}

/* Adjust page content spacing */
.site-content {
    margin-top: 0 !important;
}

/* ═══════════ ASTRA OVERRIDES ═══════════ */
/* Remove Astra's default header spacing if any */
#masthead { display: none !important; }

/* Hide page title on home page */
.home .entry-header,
.home .post-title,
.home .entry-title,
.home .ast-archive-description {
    display: none !important;
}

/* Natural full width for hero banner in stretched layout */
.zooboxi-hero-banner-wrap {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 40px 0 !important;
    padding: 0 !important;
}
.zooboxi-hero-banner-wrap img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* Box all other homepage content blocks to 1200px with nice margins */
.home .site-content .entry-content > * {
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    box-sizing: border-box !important;
}

/* Except the hero banner wrap which must be absolute edge-to-edge full width */
.home .site-content .entry-content > .zooboxi-hero-banner-wrap {
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Strip all container side padding and margins from homepage outer wrappers */
.home .site-content,
.home .site-content .ast-container,
.home #primary,
.home .site-main,
.home article,
.home .entry-content {
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 0 !important; /* completely zero out top padding */
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 0 !important; /* completely zero out top margins */
    width: 100% !important;
}

/* Ensure the hero banner wrap has no top spacing */
.zooboxi-hero-banner-wrap {
    width: 100% !important;
    max-width: 100% !important;
    margin-top: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 40px !important;
    padding: 0 !important;
}

/* Prevent horizontal scroll */
html, body {
    overflow-x: hidden !important;
}

/* ═══════════ MODERN PREMIUM CART REDESIGN (ZID MATCH) ═══════════ */
body.woocommerce-cart {
    background-color: #fafbfa !important;
}

/* Page Title & Breadcrumbs */
.woocommerce-cart .entry-title {
    font-family: 'El Messiri', 'Tajawal', sans-serif !important;
    font-size: 28px !important;
    font-weight: 700 !important;
    color: var(--z-text) !important;
    margin-bottom: 8px !important;
}
.woocommerce-cart .woocommerce-breadcrumb,
.woocommerce-cart .ast-breadcrumbs {
    font-size: 13px !important;
    color: #7a8a7c !important;
    margin-bottom: 30px !important;
}

/* Cart Container Layout */
.woocommerce-cart .woocommerce {
    display: flex !important;
    flex-direction: row !important;
    gap: 30px !important;
    align-items: flex-start !important;
    width: 100% !important;
}
@media (max-width: 921px) {
    .woocommerce-cart .woocommerce {
        flex-direction: column !important;
    }
}

/* Cart Form Container (Right Column) */
.woocommerce-cart .woocommerce-cart-form {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    flex: 1 !important;
    width: 100% !important;
}

/* Turn WooCommerce table into a single premium card container */
.woocommerce-cart table.cart {
    display: flex !important;
    flex-direction: column !important;
    background: #ffffff !important;
    border: 1px solid #eef2ed !important;
    border-radius: 20px !important;
    width: 100% !important;
    box-shadow: 0 10px 30px rgba(44, 62, 45, 0.02) !important;
    overflow: hidden !important;
    padding: 0 !important;
}
.woocommerce-cart table.cart thead {
    display: none !important; /* Hide standard header row */
}
.woocommerce-cart table.cart tbody {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
}

/* Individual product row inside the card container */
.woocommerce-cart table.cart tr.cart_item {
    display: grid !important;
    grid-template-columns: 160px 1fr auto 120px !important;
    grid-template-rows: auto auto !important;
    grid-template-areas:
        "thumbnail name name subtotal"
        "thumbnail quantity remove subtotal" !important;
    gap: 8px 24px !important;
    background: #ffffff !important;
    border: none !important;
    border-bottom: 1px solid #f0f4f0 !important;
    padding: 24px !important;
    margin-bottom: 0 !important;
    box-shadow: none !important;
    align-items: center !important;
    transition: background-color 0.2s ease !important;
    position: relative !important;
}
.woocommerce-cart table.cart tr.cart_item:last-child {
    border-bottom: none !important;
}
.woocommerce-cart table.cart tr.cart_item:hover {
    background-color: #fafdfa !important;
}

/* Direction aware LTR (English) layout override */
body.en .woocommerce-cart table.cart tr.cart_item,
html[lang="en"] .woocommerce-cart table.cart tr.cart_item,
:lang(en) .woocommerce-cart table.cart tr.cart_item {
    grid-template-columns: 160px 1fr auto 120px !important;
    grid-template-areas:
        "thumbnail name name subtotal"
        "thumbnail quantity remove subtotal" !important;
}

/* Product cells placement */
.woocommerce-cart table.cart td {
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
}

/* Image/Thumbnail */
.woocommerce-cart table.cart td.product-thumbnail {
    grid-area: thumbnail !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 160px !important;
    height: 160px !important;
}
.woocommerce-cart table.cart td.product-thumbnail img {
    border-radius: 12px !important;
    border: 1px solid #f0f4f0 !important;
    object-fit: contain !important;
    padding: 4px !important;
    background-color: #fff !important;
    width: 160px !important;
    height: 160px !important;
    max-width: 160px !important;
    max-height: 160px !important;
    min-width: 160px !important;
    min-height: 160px !important;
    transition: transform 0.2s !important;
    display: block !important;
}
.woocommerce-cart table.cart tr.cart_item:hover td.product-thumbnail img {
    transform: scale(1.03);
}

/* Product Name */
.woocommerce-cart table.cart td.product-name {
    grid-area: name !important;
    text-align: right !important;
    align-self: end !important;
}
body.en .woocommerce-cart table.cart td.product-name,
html[lang="en"] .woocommerce-cart table.cart td.product-name,
:lang(en) .woocommerce-cart table.cart td.product-name {
    text-align: left !important;
}
.woocommerce-cart .product-name a {
    font-family: 'Tajawal', sans-serif !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    text-decoration: none !important;
    line-height: 1.4 !important;
    display: block !important;
    transition: color 0.2s !important;
}
.woocommerce-cart .product-name a:hover {
    color: var(--z-primary) !important;
}

/* Quantity Control (Pill form) under the name */
.woocommerce-cart table.cart td.product-quantity {
    grid-area: quantity !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    align-self: start !important;
}
body.en .woocommerce-cart table.cart td.product-quantity,
html[lang="en"] .woocommerce-cart table.cart td.product-quantity,
:lang(en) .woocommerce-cart table.cart td.product-quantity {
    justify-content: flex-start !important;
}
.woocommerce-cart .quantity {
    display: inline-flex !important;
    align-items: center !important;
    background-color: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 25px !important;
    padding: 4px 10px !important;
    height: 40px !important;
    box-sizing: border-box !important;
}
.woocommerce-cart .quantity input[type="number"] {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    color: var(--z-text) !important;
    text-align: center !important;
    width: 40px !important;
    height: 100% !important;
    padding: 0 !important;
}
.woocommerce-cart .quantity .minus,
.woocommerce-cart .quantity .plus,
.woocommerce-cart .quantity input[type="button"] {
    background: none !important;
    border: none !important;
    font-size: 18px !important;
    font-weight: bold !important;
    color: #64748b !important;
    cursor: pointer !important;
    padding: 0 4px !important;
    width: 24px !important;
    height: 100% !important;
    line-height: 1 !important;
    transition: color 0.2s !important;
    box-shadow: none !important;
}
.woocommerce-cart .quantity .minus:hover,
.woocommerce-cart .quantity .plus:hover {
    color: var(--z-primary) !important;
}

/* Price/Subtotal on the far left */
.woocommerce-cart table.cart td.product-subtotal {
    grid-area: subtotal !important;
    text-align: left !important;
    align-self: end !important;
}
body.en .woocommerce-cart table.cart td.product-subtotal,
html[lang="en"] .woocommerce-cart table.cart td.product-subtotal,
:lang(en) .woocommerce-cart table.cart td.product-subtotal {
    text-align: right !important;
}
.woocommerce-cart .product-subtotal .amount,
.woocommerce-cart .cart_item td[data-title="المجموع"] .amount {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    font-family: 'Tajawal', sans-serif !important;
}

/* Delete button left of quantity */
.woocommerce-cart table.cart td.product-remove {
    grid-area: remove !important;
    text-align: right !important;
    align-self: center !important;
    padding-right: 15px !important;
}
body.en .woocommerce-cart table.cart td.product-remove,
html[lang="en"] .woocommerce-cart table.cart td.product-remove,
:lang(en) .woocommerce-cart table.cart td.product-remove {
    text-align: right !important;
}
.woocommerce-cart td.product-remove a.remove {
    color: #888888 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    display: inline-block !important;
    background: transparent !important;
    border: none !important;
    cursor: pointer !important;
    width: auto !important;
    height: auto !important;
    white-space: nowrap !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
}
.woocommerce-cart td.product-remove a.remove svg,
.woocommerce-cart td.product-remove a.remove i {
    display: none !important;
}
.woocommerce-cart td.product-remove a.remove:hover {
    color: #d46856 !important;
    text-decoration: underline !important;
}
.woocommerce-cart td.product-remove a.remove::before {
    content: "حذف" !important;
    font-size: 13px !important;
    font-family: 'Tajawal', sans-serif !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
}
body.en .woocommerce-cart td.product-remove a.remove::before,
html[lang="en"] .woocommerce-cart td.product-remove a.remove::before,
:lang(en) .woocommerce-cart td.product-remove a.remove::before {
    content: "Delete" !important;
    white-space: nowrap !important;
}

/* Hide legacy cells or buttons */
.woocommerce-cart table.cart td.product-price,
.woocommerce-cart table.cart td.actions button.button.update_cart_btn {
    display: none !important;
}
.woocommerce-cart table.cart tr:not(.cart_item) {
    display: block !important;
    width: 100% !important;
    border: none !important;
}
.woocommerce-cart table.cart td.actions {
    display: flex !important;
    justify-content: flex-end !important;
    padding: 10px 0 0 0 !important;
}
.woocommerce-cart table.cart button[name="update_cart"],
.woocommerce-cart .woocommerce-cart-form button[name="update_cart"],
.woocommerce-cart-form button[name="update_cart"] {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    pointer-events: none !important;
}

/* Responsive Cart Cards for Mobile Screens */
@media (max-width: 600px) {
    .woocommerce-cart table.cart tr.cart_item {
        grid-template-columns: 1fr 75px !important;
        grid-template-rows: auto auto auto !important;
        grid-template-areas:
            "name thumbnail"
            "quantity thumbnail"
            "subtotal remove" !important;
        gap: 12px 14px !important;
        padding: 16px !important;
    }
    body.en .woocommerce-cart table.cart tr.cart_item,
    html[lang="en"] .woocommerce-cart table.cart tr.cart_item,
    :lang(en) .woocommerce-cart table.cart tr.cart_item {
        grid-template-columns: 75px 1fr !important;
        grid-template-areas:
            "thumbnail name"
            "thumbnail quantity"
            "remove subtotal" !important;
    }
    .woocommerce-cart table.cart td.product-thumbnail {
        width: 75px !important;
        height: 75px !important;
    }
    .woocommerce-cart table.cart td.product-subtotal {
        text-align: right !important;
        align-self: center !important;
    }
    body.en .woocommerce-cart table.cart td.product-subtotal,
    html[lang="en"] .woocommerce-cart table.cart td.product-subtotal,
    :lang(en) .woocommerce-cart table.cart td.product-subtotal {
        text-align: right !important;
    }
    .woocommerce-cart table.cart td.product-remove {
        text-align: left !important;
        align-self: center !important;
    }
    body.en .woocommerce-cart table.cart td.product-remove,
    html[lang="en"] .woocommerce-cart table.cart td.product-remove,
    :lang(en) .woocommerce-cart table.cart td.product-remove {
        text-align: left !important;
    }
}

/* Cart Totals Box (Left Column - "ملخص الإجمالي") */
.woocommerce-cart .cart-collaterals,
.woocommerce-cart .cart_totals {
    background: #ffffff !important;
    border: 1px solid #eef2ed !important;
    border-radius: 20px !important;
    box-shadow: 0 10px 30px rgba(44, 62, 45, 0.02) !important;
    padding: 24px !important;
    width: 360px !important;
    min-width: 360px !important;
    box-sizing: border-box !important;
}
@media (max-width: 921px) {
    .woocommerce-cart .woocommerce-cart-form,
    .woocommerce-cart .cart-collaterals,
    .woocommerce-cart .cart_totals {
        width: 100% !important;
        min-width: 100% !important;
    }
}

.woocommerce-cart .cart_totals h2 {
    font-family: 'Tajawal', sans-serif !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    color: var(--z-primary) !important;
    border-bottom: 1px solid #f0f4f0 !important;
    padding-bottom: 12px !important;
    margin-bottom: 16px !important;
    text-align: right !important;
}
body.en .woocommerce-cart .cart_totals h2,
html[lang="en"] .woocommerce-cart .cart_totals h2,
:lang(en) .woocommerce-cart .cart_totals h2 {
    text-align: left !important;
}

/* Dynamic Free Shipping Progress Bar Visual Styling */
.zooboxi-shipping-progress-wrapper {
    background: rgba(66, 157, 156, 0.05) !important;
    border: 1px solid rgba(66, 157, 156, 0.1) !important;
    border-radius: 12px !important;
    padding: 12px 16px !important;
    margin-bottom: 20px !important;
    box-sizing: border-box !important;
    text-align: center !important;
}
.zooboxi-shipping-progress-msg {
    font-size: 12px !important;
    font-weight: 600 !important;
    color: var(--z-text) !important;
    margin-bottom: 8px !important;
    line-height: 1.4 !important;
}
.zooboxi-shipping-progress-bar {
    background: #e2e8e0 !important;
    height: 6px !important;
    border-radius: 6px !important;
    overflow: hidden !important;
    position: relative !important;
    width: 100% !important;
}
.zooboxi-shipping-progress-bar span {
    background: var(--z-primary) !important;
    display: block !important;
    height: 100% !important;
    border-radius: 6px !important;
    transition: width 0.8s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Totals table clean list style */
.woocommerce-cart .cart_totals table.shop_table {
    border: none !important;
    margin-bottom: 16px !important;
    background: transparent !important;
    width: 100% !important;
}
.woocommerce-cart .cart_totals table.shop_table tr {
    border-bottom: 1px solid #f4f8f4 !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 6px 0 !important;
}
.woocommerce-cart .cart_totals table.shop_table tr.order-total {
    border-bottom: none !important;
    margin-top: 10px !important;
}
.woocommerce-cart .cart_totals table.shop_table th {
    font-size: 13px !important;
    color: #6b7c6e !important;
    font-weight: 600 !important;
    padding: 8px 0 !important;
    text-align: right !important;
    border: none !important;
}
body.en .woocommerce-cart .cart_totals table.shop_table th,
html[lang="en"] .woocommerce-cart .cart_totals table.shop_table th,
:lang(en) .woocommerce-cart .cart_totals table.shop_table th {
    text-align: left !important;
}
.woocommerce-cart .cart_totals table.shop_table td {
    font-size: 14px !important;
    color: var(--z-text) !important;
    font-weight: 700 !important;
    padding: 8px 0 !important;
    text-align: left !important;
    border: none !important;
}
body.en .woocommerce-cart .cart_totals table.shop_table td,
html[lang="en"] .woocommerce-cart .cart_totals table.shop_table td,
:lang(en) .woocommerce-cart .cart_totals table.shop_table td {
    text-align: right !important;
}
.woocommerce-cart .cart_totals table.shop_table tr.order-total th {
    font-size: 16px !important;
    font-weight: 800 !important;
    color: var(--z-text) !important;
}
.woocommerce-cart .cart_totals table.shop_table tr.order-total td {
    font-size: 20px !important;
    color: var(--z-primary) !important;
    font-weight: bold !important;
    font-family: 'Tajawal', sans-serif !important;
}

/* Points / reward notices skin */
.woocommerce-cart .reward-points,
.woocommerce-cart .points-notice,
.woocommerce-cart .wc-points-rewards-points-earn {
    background-color: rgba(66, 157, 156, 0.04) !important;
    border: 1px dashed rgba(66, 157, 156, 0.2) !important;
    border-radius: 12px !important;
    padding: 12px 16px !important;
    font-size: 12px !important;
    color: var(--z-text) !important;
    font-weight: 600 !important;
    margin-bottom: 16px !important;
    line-height: 1.4 !important;
    box-sizing: border-box !important;
    text-align: right !important;
}
body.en .woocommerce-cart .reward-points,
body.en .woocommerce-cart .points-notice,
body.en .woocommerce-cart .wc-points-rewards-points-earn,
html[lang="en"] .woocommerce-cart .reward-points,
html[lang="en"] .woocommerce-cart .points-notice,
html[lang="en"] .woocommerce-cart .wc-points-rewards-points-earn {
    text-align: left !important;
}

/* Coupon box redesign */
.woocommerce-cart .coupon {
    display: flex !important;
    gap: 8px !important;
    margin-bottom: 20px !important;
    margin-top: 10px !important;
    width: 100% !important;
}
.woocommerce-cart .coupon input#coupon_code {
    height: 40px !important;
    border-radius: 8px !important;
    border: 1px solid #cbd5e1 !important;
    padding: 0 12px !important;
    font-size: 13px !important;
    transition: border-color 0.2s !important;
    background: #fafbfa !important;
    flex: 1 !important;
    box-sizing: border-box !important;
}
.woocommerce-cart .coupon input#coupon_code:focus {
    border-color: var(--z-primary) !important;
    outline: none !important;
}
.woocommerce-cart .coupon button.button,
.woocommerce-cart .coupon input[type="submit"] {
    height: 40px !important;
    border-radius: 8px !important;
    padding: 0 16px !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    background-color: transparent !important;
    color: var(--z-primary) !important;
    border: 1px solid var(--z-primary) !important;
    transition: all 0.2s !important;
    box-shadow: none !important;
    cursor: pointer !important;
}
.woocommerce-cart .coupon button.button:hover,
.woocommerce-cart .coupon input[type="submit"]:hover {
    background-color: var(--z-primary) !important;
    color: #ffffff !important;
}

/* Checkout Button ("إتمام الطلب") */
.woocommerce-cart .checkout-button,
.woocommerce-cart .wc-proceed-to-checkout .checkout-button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 48px !important;
    background: var(--z-primary) !important;
    color: #ffffff !important;
    font-family: 'Tajawal', sans-serif !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    padding: 0 20px !important;
    border-radius: 10px !important;
    box-shadow: none !important;
    transition: all 0.3s ease !important;
    border: none !important;
    cursor: pointer !important;
    margin-top: 12px !important;
    box-sizing: border-box !important;
}
.woocommerce-cart .checkout-button:hover,
.woocommerce-cart .wc-proceed-to-checkout .checkout-button:hover {
    background: var(--z-primary-dark) !important;
}

/* Secondary Button designs ("اجعلها هدية" / "متابعة التسوق") */
.woocommerce-cart a.button.continue-shopping,
.woocommerce-cart .continue-shopping,
.woocommerce-cart a.button:not(.checkout-button):not(.checkout):not(#ast-apply-coupon),
.woocommerce-cart button.button:not(.checkout-button):not(.checkout):not(#ast-apply-coupon):not(.apply-coupon) {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 44px !important;
    background: #ffffff !important;
    color: var(--z-primary) !important;
    border: 1px solid var(--z-primary) !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    padding: 0 20px !important;
    border-radius: 10px !important;
    margin-top: 10px !important;
    transition: all 0.3s ease !important;
    box-shadow: none !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
    text-decoration: none !important;
}
.woocommerce-cart a.button.continue-shopping:hover,
.woocommerce-cart .continue-shopping:hover,
.woocommerce-cart a.button:not(.checkout-button):not(.checkout):not(#ast-apply-coupon):hover,
.woocommerce-cart button.button:not(.checkout-button):not(.checkout):not(#ast-apply-coupon):not(.apply-coupon):hover {
    background-color: var(--z-primary) !important;
    color: #ffffff !important;
    border-color: var(--z-primary) !important;
    transform: translateY(-1px) !important;
}

/* ═══════════ WOOCOMMERCE PRODUCT CARDS — PRO REDESIGN ═══════════ */

/* ── Card Container ───────────────────────────────── */
.woocommerce ul.products li.product {
    border-radius: 20px !important;
    border: 1px solid rgba(226, 232, 224, 0.7) !important;
    overflow: hidden !important;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    box-shadow: 0 2px 12px rgba(44,62,45,0.04) !important;
    background: #ffffff !important;
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    padding: 0 !important;
    margin-bottom: 30px !important;
    text-align: right !important;
}

.woocommerce ul.products li.product:hover {
    transform: translateY(-8px) !important;
    box-shadow: 0 20px 50px rgba(44,62,45,0.12), 0 8px 20px rgba(66,157,156,0.08) !important;
    border-color: rgba(66,157,156,0.25) !important;
}

/* ── Product Image Area ───────────────────────────── */
.woocommerce ul.products li.product .astra-shop-thumbnail-wrap,
.woocommerce ul.products li.product > a:first-of-type {
    position: relative !important;
    overflow: hidden !important;
    display: block !important;
    background: linear-gradient(180deg, #fafbfa 0%, #f3f5f2 100%) !important;
}

.woocommerce ul.products li.product a img,
.woocommerce ul.products li.product .astra-shop-thumbnail-wrap img {
    border-radius: 0 !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: contain !important;
    padding: 8px !important;
    width: 100% !important;
    transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.3s ease !important;
    background: transparent !important;
}

.woocommerce ul.products li.product:hover a img,
.woocommerce ul.products li.product:hover .astra-shop-thumbnail-wrap img {
    transform: scale(1.08) !important;
}

/* ── Image Overlay (Glassmorphism Quick Actions) ──── */
.woocommerce ul.products li.product .astra-shop-thumbnail-wrap::after,
.woocommerce ul.products li.product > a:first-of-type::after {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(180deg, transparent 50%, rgba(44,62,45,0.03) 100%) !important;
    pointer-events: none !important;
    transition: opacity 0.3s ease !important;
    opacity: 0 !important;
}

.woocommerce ul.products li.product:hover .astra-shop-thumbnail-wrap::after,
.woocommerce ul.products li.product:hover > a:first-of-type::after {
    opacity: 1 !important;
}

/* ── Sale Badge Redesign ──────────────────────────── */
.woocommerce ul.products li.product .onsale,
.woocommerce span.onsale {
    position: absolute !important;
    top: 14px !important;
    right: auto !important;
    left: 14px !important;
    z-index: 3 !important;
    background: linear-gradient(135deg, #ff6b6b, #ee5a24) !important;
    color: #fff !important;
    font-family: 'Tajawal', sans-serif !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    padding: 4px 12px !important;
    border-radius: 10px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    line-height: 1.5 !important;
    min-height: auto !important;
    min-width: auto !important;
    box-shadow: 0 4px 14px rgba(238,90,36,0.35) !important;
    animation: zbx-sale-shimmer 3s ease-in-out infinite !important;
    border: none !important;
    margin: 0 !important;
}

@keyframes zbx-sale-shimmer {
    0%, 100% { box-shadow: 0 4px 14px rgba(238,90,36,0.35); }
    50% { box-shadow: 0 4px 20px rgba(238,90,36,0.55), 0 0 30px rgba(238,90,36,0.15); }
}

/* ── Product Content Area ─────────────────────────── */
.woocommerce ul.products li.product .astra-shop-summary-wrap,
.woocommerce ul.products li.product .product-details-wrap {
    padding: 12px 16px 4px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    flex: 1 !important;
    order: 2 !important;
}

/* Ensure button stays inside card flow */
.woocommerce ul.products li.product > .button,
.woocommerce ul.products li.product > a.button,
.woocommerce ul.products li.product > .ast-on-card-button {
    order: 3 !important;
}

/* Thumbnail stays on top */
.woocommerce ul.products li.product > .astra-shop-thumbnail-wrap {
    order: 1 !important;
}

/* ── Category Label ───────────────────────────────── */
.woocommerce ul.products li.product .ast-woo-product-category,
.woocommerce ul.products li.product .posted_in,
.woocommerce ul.products li.product .product-category-label {
    font-size: 11px !important;
    font-weight: 600 !important;
    color: #9ca3af !important;
    text-transform: uppercase !important;
    letter-spacing: 0.8px !important;
    margin-bottom: 2px !important;
    display: block !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.woocommerce ul.products li.product .ast-woo-product-category a {
    color: #9ca3af !important;
    text-decoration: none !important;
    transition: color 0.2s !important;
}

.woocommerce ul.products li.product:hover .ast-woo-product-category a {
    color: var(--z-primary) !important;
}

/* ── Product Title ────────────────────────────────── */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product .astra-shop-summary-wrap h2,
.woocommerce ul.products li.product h2.woocommerce-loop-product__title {
    font-family: 'Tajawal', 'El Messiri', sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #1a2e1c !important;
    line-height: 1.45 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    transition: color 0.3s ease !important;
    min-height: 40px !important;
}

.woocommerce ul.products li.product:hover .woocommerce-loop-product__title,
.woocommerce ul.products li.product:hover h2.woocommerce-loop-product__title {
    color: var(--z-primary-dark) !important;
}

/* ── Delivery Badge (overlay on image) ────────────── */
.zooboxi-delivery-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 3px !important;
    padding: 4px 8px !important;
    border-radius: 8px !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    position: absolute !important;
    bottom: 8px !important;
    right: 8px !important;
    z-index: 4 !important;
    width: fit-content !important;
    font-family: 'Tajawal', sans-serif !important;
    margin: 0 !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    white-space: nowrap !important;
    pointer-events: none !important;
}

.zooboxi-badge-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    width: 12px !important;
    height: 12px !important;
}

.zooboxi-badge-icon svg {
    width: 12px !important;
    height: 12px !important;
    display: block !important;
}

/* Express — electric blue */
.zooboxi-delivery-badge--express {
    background: rgba(232, 244, 253, 0.92) !important;
    color: #1a73e8 !important;
    border: 1px solid rgba(26, 115, 232, 0.25) !important;
    box-shadow: 0 2px 8px rgba(26, 115, 232, 0.15) !important;
}

.zooboxi-delivery-badge--express .zooboxi-badge-icon {
    animation: zbx-pulse 2s ease-in-out infinite !important;
}

/* Standard — green */
.zooboxi-delivery-badge--standard {
    background: rgba(236, 253, 245, 0.92) !important;
    color: #059669 !important;
    border: 1px solid rgba(5, 150, 105, 0.25) !important;
}

/* Shipping — gray */
.zooboxi-delivery-badge--shipping {
    background: rgba(249, 250, 251, 0.92) !important;
    color: #6b7280 !important;
    border: 1px solid rgba(107, 114, 128, 0.18) !important;
}

/* Simple pulse glow — no size change */
@keyframes zbx-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.6; }
}

/* Hover — badge glows on card hover */
.woocommerce ul.products li.product:hover .zooboxi-delivery-badge--express {
    box-shadow: 0 3px 12px rgba(26, 115, 232, 0.3) !important;
}

/* ── Price Styling ────────────────────────────────── */
.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .ast-woo-product-price .price {
    font-family: 'Tajawal', sans-serif !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    color: var(--z-text) !important;
    margin-top: 6px !important;
    margin-bottom: 2px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
    line-height: 1.3 !important;
}

/* Current price */
.woocommerce ul.products li.product .price ins,
.woocommerce ul.products li.product .price > .amount,
.woocommerce ul.products li.product .price > span > .amount {
    color: #1a2e1c !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    background: none !important;
    font-size: 16px !important;
}

/* Sale old price */
.woocommerce ul.products li.product .price del,
.woocommerce ul.products li.product .price del .amount {
    color: #c8c8c8 !important;
    font-weight: 500 !important;
    font-size: 12px !important;
    text-decoration: line-through !important;
    opacity: 0.7 !important;
}

/* Price range */
.woocommerce ul.products li.product .price .amount:first-child {
    font-weight: 700 !important;
}

/* ── Add to Cart Button ───────────────────────────── */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product a.button,
.woocommerce ul.products li.product .ast-on-card-button a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    margin: 4px 16px 16px !important;
    padding: 10px 16px !important;
    border-radius: 12px !important;
    font-family: 'Tajawal', sans-serif !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    background: var(--z-primary) !important;
    color: #ffffff !important;
    border: none !important;
    cursor: pointer !important;
    transition: all 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    text-decoration: none !important;
    gap: 6px !important;
    letter-spacing: 0.3px !important;
    position: relative !important;
    overflow: hidden !important;
    box-shadow: 0 4px 14px rgba(66,157,156,0.2) !important;
    box-sizing: border-box !important;
}

/* Button hover glow */
.woocommerce ul.products li.product .button:hover,
.woocommerce ul.products li.product a.button:hover {
    background: var(--z-primary-dark) !important;
    box-shadow: 0 6px 22px rgba(66,157,156,0.35) !important;
    transform: translateY(-2px) !important;
}

/* Button active press */
.woocommerce ul.products li.product .button:active,
.woocommerce ul.products li.product a.button:active {
    transform: translateY(0) scale(0.98) !important;
    box-shadow: 0 2px 8px rgba(66,157,156,0.2) !important;
}

/* Select Options button variant */
.woocommerce ul.products li.product a.button.product_type_variable,
.woocommerce ul.products li.product a.button.product_type_grouped {
    background: transparent !important;
    color: var(--z-primary) !important;
    border: 2px solid var(--z-primary) !important;
    box-shadow: none !important;
}

.woocommerce ul.products li.product a.button.product_type_variable:hover,
.woocommerce ul.products li.product a.button.product_type_grouped:hover {
    background: var(--z-primary) !important;
    color: #ffffff !important;
    box-shadow: 0 6px 22px rgba(66,157,156,0.25) !important;
}

/* Added to cart feedback */
.woocommerce ul.products li.product a.added_to_cart {
    display: none !important;
}

.woocommerce ul.products li.product .button.added::after {
    content: ' ✓' !important;
}

/* ── New / Featured Badges ────────────────────────── */
.woocommerce ul.products li.product .ast-new-product-badge,
.woocommerce ul.products li.product .new-badge {
    position: absolute !important;
    top: 14px !important;
    right: 14px !important;
    left: auto !important;
    background: linear-gradient(135deg, #10b981, #059669) !important;
    color: #fff !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    padding: 4px 10px !important;
    border-radius: 8px !important;
    z-index: 3 !important;
    box-shadow: 0 4px 12px rgba(16,185,129,0.3) !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
}

/* ── Out of Stock Overlay ─────────────────────────── */
.woocommerce ul.products li.product.outofstock .astra-shop-thumbnail-wrap::before,
.woocommerce ul.products li.product.outofstock > a:first-of-type::before {
    content: 'نفدت الكمية' !important;
    position: absolute !important;
    inset: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(255,255,255,0.85) !important;
    backdrop-filter: blur(4px) !important;
    -webkit-backdrop-filter: blur(4px) !important;
    font-family: 'Tajawal', sans-serif !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #ef4444 !important;
    z-index: 2 !important;
}

.woocommerce ul.products li.product.outofstock {
    opacity: 0.75 !important;
}

.woocommerce ul.products li.product.outofstock:hover {
    transform: none !important;
    box-shadow: 0 2px 12px rgba(44,62,45,0.04) !important;
}

/* ── Grid Layout — 5 Columns ─────────────────────── */
.woocommerce ul.products {
    display: grid !important;
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 16px !important;
    width: 100% !important;
}

.woocommerce ul.products::after {
    content: none !important;
    display: none !important;
}

/* Override Astra inline width on product items */
.woocommerce ul.products li.product {
    width: 100% !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    float: none !important;
}

/* Tablet: 3 columns */
@media (max-width: 921px) {
    .woocommerce ul.products {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 12px !important;
    }
}

/* Mobile: 2 columns */
@media (max-width: 544px) {
    .woocommerce ul.products {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px !important;
    }
}

/* ── Responsive Cards ─────────────────────────────── */
@media (max-width: 768px) {
    .woocommerce ul.products li.product {
        border-radius: 16px !important;
        margin-bottom: 16px !important;
    }

    .woocommerce ul.products li.product a img {
        padding: 12px !important;
    }

    .woocommerce ul.products li.product .astra-shop-summary-wrap {
        padding: 8px 12px 4px !important;
    }

    .woocommerce ul.products li.product .woocommerce-loop-product__title {
        font-size: 13px !important;
        min-height: 36px !important;
    }

    .woocommerce ul.products li.product .price {
        font-size: 14px !important;
    }

    .woocommerce ul.products li.product .price ins .amount,
    .woocommerce ul.products li.product .price > .amount {
        font-size: 14px !important;
    }

    .woocommerce ul.products li.product .button,
    .woocommerce ul.products li.product a.button {
        margin: 4px 12px 12px !important;
        width: auto !important;
        padding: 9px 12px !important;
        font-size: 12px !important;
        border-radius: 10px !important;
    }

    .zooboxi-delivery-badge {
        font-size: 10px !important;
        padding: 3px 8px !important;
        border-radius: 8px !important;
    }
}

/* ── Loading Skeleton Placeholder ─────────────────── */
.woocommerce ul.products li.product.loading-placeholder {
    background: linear-gradient(90deg, #f0f0f0 25%, #e8e8e8 50%, #f0f0f0 75%) !important;
    background-size: 200% 100% !important;
    animation: zbx-skeleton 1.5s ease infinite !important;
}

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

/* ── Circular Categories ──────────────────────────── */
.cat-card img, .product-category img {
    border-radius: 50% !important;
    aspect-ratio: 1/1;
    object-fit: cover;
}

/* ═══════════ QUANTITY STEPPER WIDGET ═══════════ */
.zbx-qty-stepper {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin: 4px 16px 16px !important;
    border-radius: 12px !important;
    background: var(--z-primary, #429d9c) !important;
    overflow: hidden !important;
    height: 40px !important;
    transition: opacity 0.2s ease !important;
    direction: ltr !important;
}

.zbx-qty-stepper.zbx-loading {
    opacity: 0.55 !important;
    pointer-events: none !important;
}

.zbx-qty-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 40px !important;
    height: 40px !important;
    border: none !important;
    background: transparent !important;
    color: #ffffff !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    transition: background 0.2s ease !important;
    line-height: 1 !important;
    padding: 0 !important;
    -webkit-user-select: none !important;
    user-select: none !important;
    font-family: system-ui, sans-serif !important;
}

.zbx-qty-btn:hover {
    background: rgba(255,255,255,0.15) !important;
}

.zbx-qty-btn:active {
    background: rgba(255,255,255,0.25) !important;
    transform: scale(0.92) !important;
}

.zbx-qty-value {
    flex: 1 !important;
    text-align: center !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    font-family: 'Tajawal', sans-serif !important;
    line-height: 40px !important;
    min-width: 32px !important;
}

/* Hide "View cart" link when stepper is shown */
.zbx-qty-stepper + .added_to_cart {
    display: none !important;
}

/* Mobile stepper */
@media (max-width: 768px) {
    .zbx-qty-stepper {
        margin: 4px 12px 12px !important;
        height: 36px !important;
        border-radius: 10px !important;
    }
    .zbx-qty-btn {
        width: 36px !important;
        height: 36px !important;
        font-size: 18px !important;
    }
    .zbx-qty-value {
        font-size: 14px !important;
        line-height: 36px !important;
    }
}

/* ═══════════ QUICK VIEW POPUP ═══════════ */
.zbx-qv-overlay {
    position: fixed !important;
    inset: 0 !important;
    z-index: 99999 !important;
    background: rgba(0, 0, 0, 0.55) !important;
    backdrop-filter: blur(4px) !important;
    -webkit-backdrop-filter: blur(4px) !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 20px !important;
    display: none !important;
}

.zbx-qv-overlay.zbx-qv-active {
    display: flex !important;
}

.zbx-qv-modal {
    background: #ffffff !important;
    border-radius: 20px !important;
    width: 100% !important;
    max-width: 720px !important;
    max-height: 85vh !important;
    overflow-y: auto !important;
    position: relative !important;
    box-shadow: 0 25px 80px rgba(0,0,0,0.25) !important;
    animation: zbx-qv-in 0.3s ease !important;
}

@keyframes zbx-qv-in {
    from { opacity: 0; transform: scale(0.92) translateY(20px); }
    to   { opacity: 1; transform: scale(1) translateY(0); }
}

.zbx-qv-close {
    position: absolute !important;
    top: 12px !important;
    left: 12px !important;
    z-index: 10 !important;
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    border: none !important;
    background: rgba(0,0,0,0.06) !important;
    color: #333 !important;
    font-size: 22px !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.2s ease !important;
    line-height: 1 !important;
    padding: 0 !important;
}

.zbx-qv-close:hover {
    background: rgba(0,0,0,0.12) !important;
    transform: rotate(90deg) !important;
}

.zbx-qv-loading {
    display: flex;
    align-items: center !important;
    justify-content: center !important;
    padding: 80px 40px !important;
}

.zbx-qv-spinner {
    width: 40px !important;
    height: 40px !important;
    border: 3px solid #e5e7eb !important;
    border-top-color: var(--z-primary, #429d9c) !important;
    border-radius: 50% !important;
    animation: zbx-spin 0.7s linear infinite !important;
}

@keyframes zbx-spin {
    to { transform: rotate(360deg); }
}

.zbx-qv-content {
    display: flex !important;
    direction: rtl !important;
}

.zbx-qv-image-wrap {
    flex: 0 0 45% !important;
    background: #f8f9fa !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 20px !important;
    border-radius: 20px 0 0 20px !important;
}

.zbx-qv-image-wrap img {
    max-width: 100% !important;
    max-height: 350px !important;
    object-fit: contain !important;
    border-radius: 12px !important;
}

.zbx-qv-details {
    flex: 1 !important;
    padding: 28px 24px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}

.zbx-qv-title {
    font-family: 'Tajawal', 'El Messiri', sans-serif !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    color: #1a2e1c !important;
    line-height: 1.5 !important;
    margin: 0 !important;
}

.zbx-qv-price {
    font-family: 'Tajawal', sans-serif !important;
    font-size: 20px !important;
    font-weight: 800 !important;
    color: var(--z-primary, #429d9c) !important;
}

.zbx-qv-price del { color: #aaa !important; font-size: 14px !important; font-weight: 500 !important; }
.zbx-qv-price ins { text-decoration: none !important; background: none !important; }

.zbx-qv-desc {
    font-size: 13px !important;
    color: #6b7280 !important;
    line-height: 1.6 !important;
    margin: 0 !important;
    max-height: 60px !important;
    overflow: hidden !important;
}

.zbx-qv-form .variations { width: 100% !important; border: none !important; margin-bottom: 12px !important; }

.zbx-qv-attr-row {
    margin-bottom: 10px !important;
}

.zbx-qv-attr-row > label {
    display: block !important;
    font-family: 'Tajawal', sans-serif !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #374151 !important;
    margin-bottom: 8px !important;
}

.zbx-swatch-group {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

.zbx-swatch-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    padding: 8px 14px !important;
    border: 1.5px solid #e5e7eb !important;
    border-radius: 25px !important;
    background: #f9fafb !important;
    color: #374151 !important;
    font-family: 'Tajawal', sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    white-space: nowrap !important;
    line-height: 1.3 !important;
}

.zbx-swatch-btn:hover {
    border-color: var(--z-primary, #429d9c) !important;
    background: rgba(66,157,156,0.06) !important;
    transform: translateY(-1px) !important;
}

.zbx-swatch-btn.zbx-swatch-active {
    border-color: var(--z-primary, #429d9c) !important;
    background: rgba(66,157,156,0.1) !important;
    color: var(--z-primary-dark, #2d7a79) !important;
    box-shadow: 0 0 0 3px rgba(66,157,156,0.12) !important;
}

.zbx-swatch-emoji {
    font-size: 16px !important;
    line-height: 1 !important;
}

.zbx-swatch-label {
    font-size: 13px !important;
}

.zbx-qv-form .single_add_to_cart_button {
    width: 100% !important;
    padding: 12px 20px !important;
    border: none !important;
    border-radius: 12px !important;
    background: var(--z-primary, #429d9c) !important;
    color: #fff !important;
    font-family: 'Tajawal', sans-serif !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 14px rgba(66,157,156,0.2) !important;
}

.zbx-qv-form .single_add_to_cart_button:hover {
    background: var(--z-primary-dark, #37827e) !important;
    box-shadow: 0 6px 22px rgba(66,157,156,0.35) !important;
}

.zbx-qv-form .single_add_to_cart_button.disabled,
.zbx-qv-form .single_add_to_cart_button.wc-variation-selection-needed {
    opacity: 0.5 !important;
    cursor: not-allowed !important;
}

.zbx-qv-form .reset_variations { font-size: 12px !important; color: #9ca3af !important; }
.zbx-qv-form .quantity { margin-bottom: 10px !important; }
.zbx-qv-form .quantity input.qty { width: 70px !important; text-align: center !important; border: 1.5px solid #e5e7eb !important; border-radius: 10px !important; padding: 8px !important; font-size: 15px !important; font-weight: 700 !important; }
.zbx-qv-form .woocommerce-variation-price { margin-bottom: 10px !important; }

.zbx-qv-full-link {
    display: inline-block !important;
    font-size: 13px !important;
    color: var(--z-primary, #429d9c) !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    font-family: 'Tajawal', sans-serif !important;
    margin-top: 4px !important;
}

.zbx-qv-full-link:hover { color: var(--z-primary-dark, #37827e) !important; text-decoration: underline !important; }

@media (max-width: 640px) {
    .zbx-qv-overlay { padding: 10px !important; }
    .zbx-qv-content { flex-direction: column !important; }
    .zbx-qv-image-wrap { flex: none !important; border-radius: 20px 20px 0 0 !important; padding: 16px !important; }
    .zbx-qv-image-wrap img { max-height: 200px !important; }
    .zbx-qv-details { padding: 16px !important; }
    .zbx-qv-title { font-size: 16px !important; }
}

/* ═══════════ FLOATING TOAST NOTIFICATIONS ═══════════ */
.woocommerce-notices-wrapper,
.woocommerce-message,
.woocommerce-error,
.woocommerce-info,
.wc-block-components-notice-banner {
    position: fixed !important;
    top: 90px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    z-index: 99999 !important;
    max-width: 480px !important;
    width: 90vw !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    pointer-events: none;
}

.woocommerce-notices-wrapper > *,
.woocommerce-message,
.woocommerce-error,
.woocommerce-info,
.wc-block-components-notice-banner {
    pointer-events: auto;
    background: #fff !important;
    border-radius: 16px !important;
    box-shadow: 0 8px 32px rgba(0,0,0,0.15), 0 2px 8px rgba(0,0,0,0.08) !important;
    padding: 16px 20px !important;
    margin-bottom: 8px !important;
    border: none !important;
    border-right: 4px solid var(--z-primary, #43978f) !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    animation: zbx-toast-slide-in 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
    backdrop-filter: blur(12px) !important;
}

html[dir="rtl"] .woocommerce-notices-wrapper > *,
html[dir="rtl"] .woocommerce-message,
html[dir="rtl"] .woocommerce-error,
html[dir="rtl"] .woocommerce-info,
html[dir="rtl"] .wc-block-components-notice-banner {
    border-right: none !important;
    border-left: 4px solid var(--z-primary, #43978f) !important;
}

.woocommerce-error,
.wc-block-components-notice-banner.is-error {
    border-right-color: #e74c3c !important;
}
html[dir="rtl"] .woocommerce-error,
html[dir="rtl"] .wc-block-components-notice-banner.is-error {
    border-left-color: #e74c3c !important;
    border-right: none !important;
}

.woocommerce-info,
.wc-block-components-notice-banner.is-info {
    border-right-color: #3498db !important;
}
html[dir="rtl"] .woocommerce-info,
html[dir="rtl"] .wc-block-components-notice-banner.is-info {
    border-left-color: #3498db !important;
    border-right: none !important;
}

/* Toast success checkmark icon */
.woocommerce-message::before {
    color: var(--z-primary, #43978f) !important;
}
.woocommerce-error::before {
    color: #e74c3c !important;
}

/* Undo link styling */
.woocommerce-message .restore-item,
.woocommerce-message a,
.wc-block-components-notice-banner a {
    color: var(--z-primary, #43978f) !important;
    font-weight: 600 !important;
    text-decoration: underline !important;
}

/* Dismiss animation */
.zbx-toast-dismiss {
    animation: zbx-toast-slide-out 0.3s ease-in forwards !important;
}

@keyframes zbx-toast-slide-in {
    0% { opacity: 0; transform: translateY(-20px); }
    100% { opacity: 1; transform: translateY(0); }
}

@keyframes zbx-toast-slide-out {
    0% { opacity: 1; transform: translateY(0); }
    100% { opacity: 0; transform: translateY(-20px); }
}

/* Don't let notices wrapper take up space in layout */
.woocommerce-notices-wrapper:empty {
    display: none !important;
}

/* Override Astra/WC block notice styles */
.wc-block-components-notice-banner {
    position: fixed !important;
    top: 90px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    z-index: 99999 !important;
}
.wc-block-components-notice-banner__content {
    font-size: 14px !important;
}

/* ═══════════ CART SHIPPING METHODS — CLEAN REDESIGN ═══════════ */

/* Shipping row in cart totals */
.woocommerce-cart .cart_totals .shipping th {
    white-space: nowrap !important;
}

.woocommerce-cart .cart_totals .shipping td {
    text-align: right !important;
    width: 100% !important;
}
body.en .woocommerce-cart .cart_totals .shipping td,
html[lang="en"] .woocommerce-cart .cart_totals .shipping td {
    text-align: left !important;
}

/* Shipping methods list */
.woocommerce-cart .cart_totals #shipping_method {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
}

.woocommerce-cart .cart_totals #shipping_method li {
    background: #f8faf8 !important;
    border: 1.5px solid #e8ede7 !important;
    border-radius: 12px !important;
    padding: 12px 14px !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    cursor: pointer !important;
    transition: all 0.25s ease !important;
    direction: rtl !important;
}
body.en .woocommerce-cart .cart_totals #shipping_method li,
html[lang="en"] .woocommerce-cart .cart_totals #shipping_method li {
    direction: ltr !important;
}

.woocommerce-cart .cart_totals #shipping_method li:hover {
    border-color: rgba(66, 157, 156, 0.4) !important;
    background: rgba(66, 157, 156, 0.04) !important;
}

/* Selected shipping method */
.woocommerce-cart .cart_totals #shipping_method li input[type="radio"]:checked + label,
.woocommerce-cart .cart_totals #shipping_method li:has(input:checked) {
    border-color: var(--z-primary) !important;
    background: rgba(66, 157, 156, 0.06) !important;
    box-shadow: 0 0 0 1px var(--z-primary) !important;
}

/* Radio button */
.woocommerce-cart .cart_totals #shipping_method li input[type="radio"] {
    width: 18px !important;
    height: 18px !important;
    accent-color: var(--z-primary) !important;
    margin: 0 !important;
    flex-shrink: 0 !important;
}

/* Shipping label */
.woocommerce-cart .cart_totals #shipping_method li label {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--z-text) !important;
    line-height: 1.5 !important;
    cursor: pointer !important;
    flex: 1 !important;
    margin: 0 !important;
}

/* Shipping price */
.woocommerce-cart .cart_totals #shipping_method li label .woocommerce-Price-amount {
    font-weight: 700 !important;
    color: var(--z-primary) !important;
}

/* Hide the raw "Shipping options will be updated" note or style it */
.woocommerce-cart .cart_totals .woocommerce-shipping-destination,
.woocommerce-cart .cart_totals p.woocommerce-shipping-calculator-notice {
    font-size: 11px !important;
    color: #9ca3af !important;
    margin-top: 6px !important;
    font-style: italic !important;
}

/* Cart totals shipping row - stack vertically on mobile */
@media (max-width: 600px) {
    .woocommerce-cart .cart_totals table.shop_table tr.shipping {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 8px !important;
    }
    
    .woocommerce-cart .cart_totals .shipping td {
        width: 100% !important;
    }
    
    /* Coupon section mobile fix */
    .woocommerce-cart .coupon {
        flex-direction: row !important;
        flex-wrap: nowrap !important;
    }
    .woocommerce-cart .coupon input#coupon_code {
        min-width: 0 !important;
        flex: 1 1 0% !important;
        font-size: 12px !important;
    }
    .woocommerce-cart .coupon button.button,
    .woocommerce-cart .coupon input[type="submit"] {
        flex-shrink: 0 !important;
        padding: 0 12px !important;
        font-size: 12px !important;
        white-space: nowrap !important;
    }
    
    /* Free shipping progress bar fix */
    .zooboxi-shipping-progress-msg {
        font-size: 11px !important;
        text-align: center !important;
        justify-content: center !important;
    }
}

/* ═══════════════════════════════════════════════════════════════════════ */
/* ██ SUBCATEGORY NAVIGATION + PROFESSIONAL FILTERS (Zooboxi v4.0)       */
/* ═══════════════════════════════════════════════════════════════════════ */

/* ─── Category Header ─── */
.zbx-cat-header {
    margin-bottom: 20px;
    padding: 0 4px;
}

.zbx-breadcrumb {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    font-size: 13px;
    color: #999;
    margin-bottom: 16px;
    direction: rtl;
}
.zbx-breadcrumb a {
    color: #888;
    text-decoration: none;
    transition: color 0.2s;
}
.zbx-breadcrumb a:hover {
    color: var(--zbx-primary, #D4A574);
}
.zbx-bc-sep {
    color: #ccc;
    font-size: 11px;
}
.zbx-bc-current {
    color: #333;
    font-weight: 600;
}

.zbx-cat-title-row {
    display: flex;
    align-items: center;
    gap: 16px;
    direction: rtl;
}
.zbx-cat-header-icon {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid rgba(212, 165, 116, 0.25);
    box-shadow: 0 4px 16px rgba(212, 165, 116, 0.15);
    flex-shrink: 0;
}
.zbx-cat-title-text {
    flex: 1;
}
.zbx-cat-title {
    font-size: 24px !important;
    font-weight: 700 !important;
    color: #1a1a2e !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.3 !important;
}
.zbx-cat-desc {
    font-size: 13px;
    color: #888;
    margin: 4px 0 0 !important;
    line-height: 1.5;
}

/* ─── Subcategory Navigation ─── */
.zbx-subcat-nav {
    margin-bottom: 24px;
    overflow: hidden;
    position: relative;
}
.zbx-subcat-nav::after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 40px;
    background: linear-gradient(to right, #fff, transparent);
    pointer-events: none;
    z-index: 2;
}
.zbx-subcat-scroll {
    display: flex;
    gap: 14px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding: 8px 4px 12px;
    direction: rtl;
}
.zbx-subcat-scroll::-webkit-scrollbar {
    display: none;
}

.zbx-subcat-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    scroll-snap-align: start;
    flex-shrink: 0;
    min-width: 80px;
    max-width: 90px;
    transition: transform 0.2s ease;
}
.zbx-subcat-item:hover {
    transform: translateY(-3px);
}

.zbx-subcat-img-wrap {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    overflow: hidden;
    border: 3px solid #f0ebe5;
    background: linear-gradient(135deg, #faf8f5, #f5efe8);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    box-shadow: 0 3px 12px rgba(0,0,0,0.06);
}
.zbx-subcat-item:hover .zbx-subcat-img-wrap {
    border-color: var(--zbx-primary, #D4A574);
    box-shadow: 0 6px 20px rgba(212, 165, 116, 0.25);
    transform: scale(1.05);
}

.zbx-subcat-img-wrap img {
    width: 52px;
    height: 52px;
    object-fit: contain;
    border-radius: 0;
}
.zbx-subcat-emoji {
    font-size: 28px;
    line-height: 1;
}

.zbx-subcat-name {
    font-size: 11.5px;
    font-weight: 600;
    color: #444;
    text-align: center;
    line-height: 1.3;
    max-height: 2.6em;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-break: break-word;
}
.zbx-subcat-item:hover .zbx-subcat-name {
    color: var(--zbx-primary, #D4A574);
}

/* ─── Health Issues Tag Cloud ─── */
.zbx-health-tags {
    padding: 20px 0 16px;
    direction: rtl;
}
.zbx-health-tags-title {
    font-size: 16px;
    font-weight: 700;
    color: #333;
    margin: 0 0 14px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.zbx-health-icon {
    font-size: 20px;
}
.zbx-health-tags-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    direction: rtl;
}
.zbx-health-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border-radius: 20px;
    background: linear-gradient(135deg, rgba(255,255,255,0.9), rgba(245,240,235,0.7));
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1.5px solid rgba(212,165,116,0.15);
    color: #555;
    font-size: 12.5px;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.25s ease;
    cursor: pointer;
    white-space: nowrap;
}
.zbx-health-tag:hover {
    background: linear-gradient(135deg, rgba(212,165,116,0.15), rgba(212,165,116,0.08));
    border-color: var(--zbx-primary, #D4A574);
    color: #333;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212,165,116,0.2);
}
.zbx-health-tag-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 5px;
    border-radius: 10px;
    background: rgba(212,165,116,0.12);
    color: var(--zbx-primary, #D4A574);
    font-size: 10.5px;
    font-weight: 700;
    line-height: 1;
}
.zbx-health-tag:hover .zbx-health-tag-count {
    background: var(--zbx-primary, #D4A574);
    color: #fff;
}

@media (max-width: 768px) {
    .zbx-health-tags-cloud {
        gap: 6px;
    }
    .zbx-health-tag {
        padding: 6px 11px;
        font-size: 11.5px;
    }
}

/* ─── Shop Toolbar ─── */
.zbx-shop-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0;
    margin-bottom: 8px;
    border-bottom: 1px solid #f0f0f0;
    direction: rtl;
}
.zbx-product-count {
    font-size: 13px;
    color: #888;
    font-weight: 500;
}
.zbx-filter-toggle-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 18px;
    background: #1a1a2e;
    color: #fff;
    border: none;
    border-radius: 50px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    font-family: inherit;
}
.zbx-filter-toggle-btn:hover {
    background: var(--zbx-primary, #D4A574);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(212, 165, 116, 0.3);
}
.zbx-filter-toggle-btn svg {
    width: 16px;
    height: 16px;
}

/* ─── Active Filter Tags ─── */
.zbx-active-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px 0;
    direction: rtl;
    align-items: center;
}
.zbx-active-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    background: linear-gradient(135deg, #f8f4ef, #f0ebe3);
    color: #5a4a3a;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 500;
    border: 1px solid rgba(212, 165, 116, 0.3);
    animation: zbxTagIn 0.25s ease;
}
@keyframes zbxTagIn {
    from { opacity: 0; transform: scale(0.85); }
    to { opacity: 1; transform: scale(1); }
}
.zbx-tag-remove {
    background: none;
    border: none;
    color: #b08860;
    font-size: 12px;
    cursor: pointer;
    padding: 0 2px;
    line-height: 1;
    opacity: 0.7;
    transition: opacity 0.2s;
}
.zbx-tag-remove:hover {
    opacity: 1;
    color: #c0392b;
}
.zbx-clear-all-filters {
    background: none;
    border: none;
    color: #c0392b;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    padding: 4px 8px;
    text-decoration: underline;
    font-family: inherit;
}
.zbx-clear-all-filters:hover {
    color: #e74c3c;
}

/* ─── Filter Overlay ─── */
.zbx-filter-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    z-index: 99998;
    opacity: 0;
    visibility: hidden;
    transition: all 0.35s ease;
}
.zbx-filter-overlay.zbx-open {
    opacity: 1;
    visibility: visible;
}

/* ─── Filter Sidebar ─── */
.zbx-filter-sidebar {
    position: fixed;
    top: 0;
    right: -360px;
    width: 340px;
    max-width: 88vw;
    height: 100dvh;
    background: #fff;
    z-index: 99999;
    display: flex;
    flex-direction: column;
    transition: right 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: -8px 0 32px rgba(0, 0, 0, 0.15);
    overflow: hidden;
}
.zbx-filter-sidebar.zbx-open {
    right: 0;
}

.zbx-filter-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 20px;
    border-bottom: 1px solid #f0f0f0;
    direction: rtl;
    flex-shrink: 0;
    background: linear-gradient(to bottom, #faf8f5, #fff);
}
.zbx-filter-title {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #1a1a2e !important;
    margin: 0 !important;
}
.zbx-filter-close {
    background: #f5f5f5;
    border: none;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    font-size: 14px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #666;
    transition: all 0.2s;
}
.zbx-filter-close:hover {
    background: #e74c3c;
    color: #fff;
}

.zbx-filter-body {
    flex: 1;
    overflow-y: auto;
    padding: 8px 0;
    scrollbar-width: thin;
    scrollbar-color: #ddd transparent;
    direction: rtl;
}
.zbx-filter-body::-webkit-scrollbar {
    width: 4px;
}
.zbx-filter-body::-webkit-scrollbar-thumb {
    background: #ddd;
    border-radius: 4px;
}

/* ─── Filter Section (Accordion) ─── */
.zbx-filter-section {
    border-bottom: 1px solid #f5f5f5;
}
.zbx-filter-section-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 14px 20px;
    background: none;
    border: none;
    font-size: 14px;
    font-weight: 600;
    color: #333;
    cursor: pointer;
    font-family: inherit;
    direction: rtl;
    text-align: right;
    transition: background 0.2s;
}
.zbx-filter-section-toggle:hover {
    background: #faf8f5;
}
.zbx-filter-section-toggle .zbx-chevron {
    transition: transform 0.3s ease;
    flex-shrink: 0;
}
.zbx-filter-section.zbx-filter-open .zbx-chevron {
    transform: rotate(180deg);
}

.zbx-filter-section-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s ease, padding 0.35s ease;
    padding: 0 20px;
}
.zbx-filter-section.zbx-filter-open .zbx-filter-section-content {
    max-height: 500px;
    padding: 0 20px 16px;
    overflow-y: auto;
}

/* ─── Sort Options ─── */
.zbx-sort-options {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.zbx-sort-option {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.2s;
    font-size: 13px;
    color: #555;
}
.zbx-sort-option:hover {
    background: #f9f6f2;
}
.zbx-sort-option input[type="radio"] {
    accent-color: var(--zbx-primary, #D4A574);
    width: 16px;
    height: 16px;
    margin: 0;
}
.zbx-sort-option input[type="radio"]:checked + span {
    color: #1a1a2e;
    font-weight: 600;
}

/* ─── Filter Checkboxes ─── */
.zbx-filter-checkboxes {
    display: flex;
    flex-direction: column;
    gap: 2px;
    max-height: 280px;
    overflow-y: auto;
    scrollbar-width: thin;
}
.zbx-filter-option {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 10px;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.15s;
    font-size: 13px;
}
.zbx-filter-option:hover {
    background: #f9f6f2;
}
.zbx-filter-option input[type="checkbox"] {
    accent-color: var(--zbx-primary, #D4A574);
    width: 15px;
    height: 15px;
    margin: 0;
    flex-shrink: 0;
    border-radius: 3px;
}
.zbx-filter-label {
    flex: 1;
    color: #444;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.zbx-filter-count {
    font-size: 11px;
    color: #aaa;
    flex-shrink: 0;
}
.zbx-filter-option input[type="checkbox"]:checked ~ .zbx-filter-label {
    color: #1a1a2e;
    font-weight: 600;
}

.zbx-hidden-option {
    display: none !important;
}

.zbx-show-more-btn {
    background: none;
    border: none;
    color: var(--zbx-primary, #D4A574);
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    padding: 8px 10px;
    font-family: inherit;
    transition: color 0.2s;
}
.zbx-show-more-btn:hover {
    color: #b0875a;
}

/* ─── Price Range Slider ─── */
.zbx-price-range {
    padding: 8px 0;
}
.zbx-price-slider-track {
    position: relative;
    height: 6px;
    background: #eee;
    border-radius: 3px;
    margin: 16px 0;
}
.zbx-price-slider-range {
    position: absolute;
    height: 100%;
    background: linear-gradient(90deg, var(--zbx-primary, #D4A574), #c99460);
    border-radius: 3px;
    z-index: 1;
}
.zbx-price-input {
    position: absolute;
    width: 100%;
    height: 6px;
    top: 0;
    left: 0;
    -webkit-appearance: none;
    appearance: none;
    background: transparent;
    pointer-events: none;
    z-index: 2;
    margin: 0;
    padding: 0;
}
.zbx-price-input::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 20px;
    height: 20px;
    background: #fff;
    border: 3px solid var(--zbx-primary, #D4A574);
    border-radius: 50%;
    cursor: pointer;
    pointer-events: all;
    box-shadow: 0 2px 8px rgba(0,0,0,0.12);
    transition: transform 0.15s, box-shadow 0.15s;
}
.zbx-price-input::-webkit-slider-thumb:hover {
    transform: scale(1.15);
    box-shadow: 0 4px 14px rgba(212, 165, 116, 0.4);
}
.zbx-price-input::-moz-range-thumb {
    width: 20px;
    height: 20px;
    background: #fff;
    border: 3px solid var(--zbx-primary, #D4A574);
    border-radius: 50%;
    cursor: pointer;
    pointer-events: all;
    box-shadow: 0 2px 8px rgba(0,0,0,0.12);
}
.zbx-price-labels {
    display: flex;
    justify-content: space-between;
    font-size: 12px;
    font-weight: 600;
    color: #666;
    margin-top: 8px;
}

/* ─── Filter Footer ─── */
.zbx-filter-footer {
    display: flex;
    gap: 10px;
    padding: 16px 20px;
    border-top: 1px solid #f0f0f0;
    background: #fff;
    flex-shrink: 0;
    direction: rtl;
}
.zbx-filter-btn-reset {
    flex: 1;
    padding: 12px;
    background: #f5f5f5;
    color: #666;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.2s;
}
.zbx-filter-btn-reset:hover {
    background: #eee;
    color: #333;
}
.zbx-filter-btn-apply {
    flex: 1.5;
    padding: 12px;
    background: linear-gradient(135deg, #1a1a2e, #2d2d4e);
    color: #fff;
    border: none;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.3s;
}
.zbx-filter-btn-apply:hover {
    background: linear-gradient(135deg, var(--zbx-primary, #D4A574), #c99460);
    transform: translateY(-1px);
    box-shadow: 0 4px 16px rgba(212, 165, 116, 0.35);
}

/* ─── No Results ─── */
.zbx-no-results {
    text-align: center;
    padding: 60px 20px;
    direction: rtl;
}
.zbx-no-results-icon {
    font-size: 48px;
    margin-bottom: 16px;
    animation: zbxBounce 2s infinite;
}
@keyframes zbxBounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
}
.zbx-no-results-text {
    font-size: 16px;
    color: #666;
    margin-bottom: 20px;
}
.zbx-no-results-reset {
    padding: 10px 24px;
    background: var(--zbx-primary, #D4A574);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.2s;
}
.zbx-no-results-reset:hover {
    background: #c99460;
    transform: translateY(-2px);
}

/* ─── Hide default WooCommerce stuff on category pages ─── */
.woocommerce-breadcrumb:has(+ .zbx-cat-header),
.woocommerce .woocommerce-breadcrumb {
    display: none !important;
}
.tax-product_cat .woocommerce-products-header__title,
.tax-product_cat .page-title,
.tax-product_cat .ast-archive-description,
.tax-product_cat .woocommerce-result-count,
.tax-product_cat .woocommerce-ordering {
    display: none !important;
}

/* ═══ Desktop Layout (sidebar + products side by side) ═══ */
@media (min-width: 992px) {
    .zbx-filter-sidebar {
        position: sticky;
        top: 80px;
        right: auto;
        width: 280px;
        max-width: 280px;
        height: auto;
        max-height: calc(100dvh - 100px);
        box-shadow: 0 2px 16px rgba(0,0,0,0.06);
        border-radius: 16px;
        border: 1px solid #f0ebe5;
        z-index: 10;
        flex-shrink: 0;
        display: none; /* Hidden by default, shown on toggle */
    }
    .zbx-filter-sidebar.zbx-open {
        display: flex;
        right: auto;
    }
    .zbx-filter-overlay {
        display: none !important;
    }
    .zbx-filter-close {
        display: none;
    }
    
    .zbx-cat-title {
        font-size: 28px !important;
    }
    .zbx-cat-header-icon {
        width: 64px;
        height: 64px;
    }
    
    .zbx-subcat-img-wrap {
        width: 80px;
        height: 80px;
    }
    .zbx-subcat-img-wrap img {
        width: 58px;
        height: 58px;
    }
    .zbx-subcat-name {
        font-size: 12px;
    }
    .zbx-subcat-item {
        min-width: 90px;
        max-width: 100px;
    }
}

/* ═══ Mobile Responsive ═══ */
@media (max-width: 768px) {
    .zbx-cat-title {
        font-size: 20px !important;
    }
    .zbx-cat-header-icon {
        width: 48px;
        height: 48px;
    }
    .zbx-subcat-img-wrap {
        width: 64px;
        height: 64px;
    }
    .zbx-subcat-img-wrap img {
        width: 44px;
        height: 44px;
    }
    .zbx-subcat-item {
        min-width: 72px;
        max-width: 80px;
    }
    .zbx-subcat-name {
        font-size: 10.5px;
    }
    .zbx-subcat-scroll {
        gap: 10px;
    }
    .zbx-breadcrumb {
        font-size: 12px;
    }
    .zbx-filter-sidebar {
        width: 100%;
        max-width: 100%;
        right: -100%;
    }
    .zbx-filter-sidebar.zbx-open {
        right: 0;
    }
}

@media (max-width: 480px) {
    .zbx-cat-title-row {
        gap: 12px;
    }
    .zbx-cat-header-icon {
        width: 42px;
        height: 42px;
    }
    .zbx-cat-title {
        font-size: 18px !important;
    }
    .zbx-subcat-img-wrap {
        width: 58px;
        height: 58px;
    }
    .zbx-subcat-img-wrap img {
        width: 40px;
        height: 40px;
    }
    .zbx-subcat-item {
        min-width: 66px;
        max-width: 74px;
    }
    .zbx-subcat-name {
        font-size: 10px;
    }
}