.blog-categories .swiper {
    overflow: hidden;
}

/* ----------------------------------------------- header profile dropdown ----------------------------------------- */
.mohtava-profile-item {
    position: relative;
}

.mohtava-profile-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 6px 10px;
    border-radius: 0;
    font-family: inherit;
    transition: background .2s;
}

.mohtava-profile-btn:hover {
    background: color-mix(in srgb, var(--color-secondary) 8%, transparent);
}

.mohtava-profile-avatar {
    width: 34px;
    height: 34px;
    border-radius: 0;
    background: linear-gradient(135deg, var(--color-secondary), color-mix(in srgb, var(--color-secondary) 85%, black));
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 2px 6px color-mix(in srgb, var(--color-secondary) 35%, transparent);
}

.mohtava-profile-name {
    font-size: 13px;
    font-weight: 700;
    color: #0a0a0a;
    max-width: 110px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mohtava-profile-chevron {
    color: #9ca3af;
    transition: transform .2s;
    flex-shrink: 0;
}

.mohtava-profile-btn[aria-expanded="true"] .mohtava-profile-chevron {
    transform: rotate(180deg);
}

.mohtava-profile-menu {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    min-width: 230px;
    background: #ffffff;
    border: 1px solid #f1f2f4;
    border-radius: 0;
    box-shadow: 0 18px 45px -15px rgba(0, 0, 0, .1);
    padding: 8px;
    z-index: 9999;
}

.mohtava-profile-menu[hidden] {
    display: none;
}

.mohtava-profile-head {
    padding: 10px 12px 12px;
    border-bottom: 1px solid #f1f2f4;
    margin-bottom: 6px;
}

.mohtava-profile-head b {
    display: block;
    font-size: 13px;
    color: #0a0a0a;
    margin-bottom: 2px;
}

.mohtava-profile-head span {
    display: block;
    font-size: 11.5px;
    color: #767790;
    direction: ltr;
    text-align: right;
}

.mohtava-profile-menu a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 0;
    font-size: 13px;
    font-weight: 600;
    color: #3f4064;
    text-decoration: none;
    transition: background .15s, color .15s;
}

.mohtava-profile-menu a:hover {
    background: color-mix(in srgb, var(--color-secondary) 8%, transparent);
    color: var(--color-secondary);
}

.mohtava-profile-menu a.mohtava-profile-logout {
    color: #dc2626;
}

.mohtava-profile-menu a.mohtava-profile-logout:hover {
    background: #fef2f2;
    color: #b91c1c;
}

.mohtava-profile-item--mobile .mohtava-profile-menu {
    left: auto;
    right: 0;
}

@media (max-width: 768px) {
    .mohtava-profile-name {
        display: none;
    }
    .mohtava-profile-btn {
        padding: 4px 6px;
    }
}
/* ----------------------------------------------- /header profile dropdown ----------------------------------------- */

/* ----------------------------------------------- home hero slider ----------------------------------------- */
.home-hero-slider {
    position: relative;
    background: #fff;
    padding: 24px 0 12px;
}

.swiper-home-hero {
    border-radius: 0;
    overflow: hidden;
    box-shadow: 0 18px 45px -18px rgba(0, 0, 0, .28);
}

.swiper-home-hero .swiper-slide {
    position: relative;
    height: 430px;
    background: #14142b;
}

.swiper-home-hero .hero-slide-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.swiper-home-hero .hero-slide-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to left, rgba(10, 12, 28, .85) 0%, rgba(10, 12, 28, .55) 45%, rgba(10, 12, 28, .08) 100%);
}

.swiper-home-hero .hero-slide-content {
    position: relative;
    z-index: 2;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 0 5%;
    max-width: 680px;
    color: #fff;
}

.hero-slide-title {
    margin: 0 0 14px;
    font-size: 34px;
    font-weight: 800;
    line-height: 1.5;
    text-shadow: 0 2px 12px rgba(0, 0, 0, .35);
}

.hero-slide-desc {
    margin: 0 0 26px;
    font-size: 16px;
    line-height: 30px;
    color: rgba(255, 255, 255, .88);
    max-width: 480px;
}

.hero-slide-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 13px 30px;
    background: var(--color-button);
    color: var(--color-button-text);
    border-radius: 0;
    font-weight: 700;
    font-size: 14px;
    text-decoration: none;
    box-shadow: 0 10px 24px -8px color-mix(in srgb, var(--color-button) 55%, transparent);
    transition: all .3s;
}

.hero-slide-btn:hover {
    background: var(--color-button-dark);
    transform: translateY(-2px);
    color: var(--color-button-text);
}

.swiper-home-hero .swiper-pagination {
    bottom: 18px !important;
}

.swiper-home-hero .swiper-pagination-bullet {
    width: 26px;
    height: 5px;
    border-radius: 0;
    background: rgba(255, 255, 255, .45);
    opacity: 1;
    transition: all .3s;
}

.swiper-home-hero .swiper-pagination-bullet-active {
    width: 42px;
    background: var(--color-primary);
}

.swiper-home-hero .swiper-button-next,
.swiper-home-hero .swiper-button-prev {
    width: 44px;
    height: 44px;
    border-radius: 0;
    background: rgba(255, 255, 255, .14);
    backdrop-filter: blur(6px);
    border: 1px solid rgba(255, 255, 255, .3);
    color: #fff;
    transition: all .3s;
}

.swiper-home-hero .swiper-button-next:hover,
.swiper-home-hero .swiper-button-prev:hover {
    background: var(--color-primary);
    border-color: var(--color-primary);
}

.swiper-home-hero .swiper-button-next::after,
.swiper-home-hero .swiper-button-prev::after {
    font-size: 16px;
    font-weight: 700;
}

@media (max-width: 768px) {
    .swiper-home-hero .swiper-slide {
        height: 320px;
    }
    .hero-slide-title {
        font-size: 22px;
    }
    .hero-slide-desc {
        font-size: 13px;
        line-height: 24px;
    }
    .hero-slide-btn {
        padding: 11px 22px;
        font-size: 13px;
    }
    .swiper-home-hero .swiper-button-next,
    .swiper-home-hero .swiper-button-prev {
        display: none;
    }
}
/* ----------------------------------------------- /home hero slider ----------------------------------------- */

.blog-categories .swiper-slide {
    height: auto;
}

.blog-categories .category-prev,
.blog-categories .category-next{

    position: static;

    width:40px;
    height:40px;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    align-self:center;

    flex-shrink:0;

    margin-top:0;

    border:1px solid #f1f2f4;
    border-radius: 0;
    background:#ffffff;
    color: #0a0a0a;
}

.blog-categories .category-prev {
    left: -20px;
}

.blog-categories .category-next {
    right: -20px;
}

.blog-categories .category-prev:hover,
.blog-categories .category-next:hover {
    background: #EF6000;
    border-color: #EF6000;
    color: #ffffff;
}

.blog-categories .category-prev::after,
.blog-categories .category-next::after {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
    content: "";
}

.blog-categories .swiper-button-disabled {
    opacity: .35;
    pointer-events: none;
}

/* ----------------------------------------------- post-card ----------------------------------------- */
.post-card {
    transition: transform .3s ease, box-shadow .3s ease;
    background: #ffffff;
    border: 1px solid #f1f2f4;
    border-radius: 0;
}
.post-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 30px -8px rgba(0,0,0,.06), 0 4px 12px -4px rgba(0,0,0,.04);
}
.post-card:hover .post-card-title {
    color: #EF6000;
}
.post-card-image {
    transition: transform .3s ease;
}
.post-card:hover .post-card-image {
    transform: scale(1.05);
}
/* ----------------------------------------------- /post-card ----------------------------------------- */

/* ----------------------------------------------- hero-post-card ----------------------------------------- */
.hero-post-card {
    transition: transform .3s ease, box-shadow .3s ease;
    background: #ffffff;
    border: 1px solid #f1f2f4;
    border-radius: 0;
}
.hero-post-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 24px 48px -12px rgba(0,0,0,.06);
}
.hero-post-card .hero-post-image {
    transition: transform .3s ease;
}
.hero-post-card:hover .hero-post-image {
    transform: scale(1.05);
}
/* ----------------------------------------------- /hero-post-card ----------------------------------------- */



/* ----------------------------------------------- ticker ----------------------------------------- */
.ticker-item + .ticker-item {
    border-left: 1px solid #e4e4e7;
}
/* ----------------------------------------------- /ticker ----------------------------------------- */

/* ----------------------------------------------- tag filter ----------------------------------------- */
.tag-filter-btn.active {
    background-color: #EF6000 !important;
    color: #ffffff !important;
    border-color: #EF6000 !important;
}
/* ----------------------------------------------- /tag filter ----------------------------------------- */



/* ----------------------------------------------- woocommerce ----------------------------------------- */
/* Small pagination bars, centred at the bottom of the card image.
   Swiper's own spacing rule is
   `.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet`
   (3 classes), which outranks a 2-class override, so zero the gap through its
   custom property instead of fighting it with `margin: 0`. */
.product-card-swiper .swiper-pagination {
    --swiper-pagination-bullet-horizontal-gap: 0;
    position: absolute;
    bottom: 10px;
    left: 50%;
    right: auto;
    top: auto;
    width: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    line-height: 0;
    z-index: 10;
    transform: translateX(-50%);
    pointer-events: none;
}
.product-card-swiper .swiper-pagination-bullet {
    width: 12px;
    height: 3px;
    min-width: 12px;
    margin: 0 !important;
    background: rgba(255, 255, 255, 0.55);
    border-radius: 0;
    opacity: 1;
    transition: width 0.3s ease, background 0.3s ease;
}
.product-card-swiper .swiper-pagination-bullet-active {
    width: 20px;
    background: var(--color-primary);
}
.woocommerce .price {
    font-weight: 700;
    color: var(--color-primary) !important;
}
.woocommerce .price del {
    color: #767790;
    font-weight: 400;
    font-size: 13px;
}
.woocommerce .price ins {
    text-decoration: none;
}
.woocommerce .button {
    color: var(--color-button-text) !important;
    background: var(--color-button) !important;
    border-radius: 0;
    padding: 10px 24px !important;
    font-weight: 700 !important;
    transition: all .2s !important;
}
.woocommerce .button:hover {
    background: var(--color-button-dark) !important;
    color: var(--color-button-text) !important;
}
.woocommerce .button.alt {
    background: var(--color-button) !important;
}
.woocommerce .button.alt:hover {
    background: var(--color-button-dark) !important;
    color: var(--color-button-text) !important;
}
.woocommerce .star-rating span {
    color: #d3ac61;
}
.woocommerce .woocommerce-breadcrumb {
    font-size: 13px;
    color: #767790;
    margin-bottom: 20px;
}
.woocommerce .woocommerce-breadcrumb a {
    color: var(--color-secondary);
}
.woocommerce .woocommerce-ordering select {
    border: 1px solid #f1f2f4;
    border-radius: 0;
    padding: 8px 16px;
    font-size: 13px;
    outline: none;
    cursor: pointer;
    background: #ffffff;
    color: #0a0a0a;
}
.woocommerce .woocommerce-ordering select:focus {
    border-color: var(--color-secondary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-secondary) 10%, transparent);
}
.woocommerce .woocommerce-result-count {
    font-size: 13px;
    color: #767790;
}
.woocommerce .woocommerce-pagination {
    margin-top: 32px;
}
.woocommerce .woocommerce-pagination .page-numbers {
    display: flex;
    gap: 6px;
    justify-content: center;
}
.woocommerce .woocommerce-pagination .page-numbers li .page-numbers {
    color: #0a0a0a;
    background: #ffffff;
    border: 1px solid #f1f2f4;
    border-radius: 0;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: all .2s;
    display: inline-flex;
}
.woocommerce .woocommerce-pagination .page-numbers li .page-numbers:hover {
    background: #f1f2f4;
    border-color: #EF6000;
}
.woocommerce .woocommerce-pagination .page-numbers li .page-numbers.current {
    color: var(--color-button-text);
    background: var(--color-secondary);
}
/* Single product */
.woocommerce div.product .product_title {
    font-size: 28px;
    font-weight: 800;
    color: #0a0a0a;
    margin-bottom: 8px;
}
.woocommerce div.product .woocommerce-product-rating {
    margin-bottom: 16px;
}
.woocommerce div.product .price {
    font-size: 24px;
    font-weight: 700;
    color: var(--color-primary) !important;
    margin-bottom: 20px;
}
.woocommerce div.product .price del {
    font-size: 16px;
}
.woocommerce div.product .woocommerce-product-details__short-description {
    color: #767790;
    font-size: 15px;
    line-height: 1.8;
    margin-bottom: 24px;
}
.woocommerce div.product form.cart {
    margin-bottom: 24px;
}
.woocommerce div.product form.cart .quantity .qty {
    border: 1px solid #e5e7eb;
    border-radius: 0;
    padding: 8px 12px;
    font-size: 15px;
    width: 70px;
    text-align: center;
}
.woocommerce div.product form.cart .button {
    border-radius: 0;
    padding: 12px 32px !important;
    font-size: 15px !important;
}
.woocommerce div.product .product_meta {
    font-size: 13px;
    color: #767790;
    border-top: 1px solid #f1f2f4;
    padding-top: 16px;
    margin-top: 24px;
}
.woocommerce div.product .product_meta a {
    color: var(--color-secondary);
}
.woocommerce div.product .woocommerce-tabs {
    border: 1px solid #f1f2f4;
    border-radius: 0;
    overflow: hidden;
    margin-top: 48px;
}
.woocommerce div.product .woocommerce-tabs ul.tabs {
    padding: 0;
    margin: 0;
    background: #ffffff;
    border-bottom: 1px solid #f1f2f4;
}
.woocommerce div.product .woocommerce-tabs ul.tabs::before {
    display: none;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li {
    background: transparent;
    border: none;
    border-radius: 0;
    margin: 0;
    padding: 0;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after {
    display: none;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    display: block;
    padding: 14px 24px;
    font-weight: 600;
    font-size: 14px;
    color: #767790;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
    color: var(--color-secondary);
    background: #ffffff;
    box-shadow: inset 0 -2px 0 var(--color-secondary);
}
.woocommerce div.product .woocommerce-tabs .panel {
    padding: 24px;
    color: #0a0a0a;
    font-size: 15px;
    line-height: 1.8;
    background: #ffffff;
}
.woocommerce div.product .woocommerce-tabs .panel h2 {
    font-size: 20px;
    font-weight: 700;
    color: #0a0a0a;
    margin-bottom: 16px;
}
.woocommerce div.product .woocommerce-product-gallery {
    border-radius: 0;
    overflow: hidden;
    border: 1px solid #f1f2f4;
}
.woocommerce div.product .woocommerce-product-gallery .flex-control-thumbs {
    margin-top: 8px;
    gap: 8px;
}
.woocommerce div.product .woocommerce-product-gallery .flex-control-thumbs li {
    border-radius: 0;
    overflow: hidden;
    border: 2px solid transparent;
    transition: border-color .2s;
}
.woocommerce div.product .woocommerce-product-gallery .flex-control-thumbs li img.flex-active {
    border-color: var(--color-secondary);
}
.woocommerce div.product .onsale {
    background: var(--color-primary);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    padding: 4px 14px;
    border-radius: 0;
    min-height: auto;
    line-height: 1;
    min-width: auto;
}
.woocommerce div.product .related {
    margin-top: 48px;
}
.woocommerce div.product .related h2 {
    font-size: 24px;
    font-weight: 800;
    color: #0a0a0a;
    margin-bottom: 24px;
}
/* ----------------------------------------------- /woocommerce ----------------------------------------- */

/* ----------------------------------------------- woocommerce form overrides ----------------------------------------- */
.woocommerce .form-row .select2-container .select2-selection--single {
    border: 1px solid #f1f2f4;
    border-radius: 0;
    height: 48px;
    padding: 8px 12px;
    background: #ffffff;
}
.woocommerce .form-row .select2-container .select2-selection--single .select2-selection__rendered {
    line-height: 32px;
    font-size: 14px;
    color: #0a0a0a;
}
.woocommerce .form-row .select2-container .select2-selection--single .select2-selection__arrow {
    top: 12px;
}
.woocommerce .form-row .select2-container--focus .select2-selection--single {
    border-color: var(--color-secondary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-secondary) 10%, transparent);
}
.select2-dropdown {
    border: 1px solid #f1f2f4;
    border-radius: 0;
    overflow: hidden;
    background: #ffffff;
}
.select2-results__option {
    padding: 10px 16px;
    font-size: 14px;
    color: #0a0a0a;
}
.select2-results__option--highlighted {
    background: color-mix(in srgb, var(--color-secondary) 15%, transparent) !important;
    color: var(--color-secondary) !important;
}
.woocommerce #shipping_method {
    list-style: none;
    padding: 0;
    margin: 0;
}
.woocommerce #shipping_method li {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border: 1px solid #f1f2f4;
    border-radius: 0;
    margin-bottom: 6px;
    transition: all .2s;
    cursor: pointer;
    background: #ffffff;
    color: #0a0a0a;
}
.woocommerce #shipping_method li:hover {
    border-color: var(--color-secondary);
    background: color-mix(in srgb, var(--color-secondary) 8%, transparent);
}
.woocommerce #shipping_method li input[type="radio"] {
    accent-color: var(--color-secondary);
    width: 18px;
    height: 18px;
}
.woocommerce #shipping_method li label {
    flex: 1;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    margin: 0;
}
.woocommerce #shipping_method li .amount {
    font-weight: 700;
    color: var(--color-primary);
}
.shipping-calculator-button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: var(--color-secondary);
    font-weight: 600;
    cursor: pointer;
    margin-top: 8px;
}
.shipping-calculator-form {
    margin-top: 12px;
    padding: 16px;
    background: #ffffff;
    border-radius: 0;
    border: 1px solid #f1f2f4;
}
.shipping-calculator-form .form-row {
    margin-bottom: 10px;
}
.shipping-calculator-form input,
.shipping-calculator-form select {
    width: 100%;
    padding: 10px 14px;
    border: 1px solid #f1f2f4;
    border-radius: 0;
    font-size: 13px;
    outline: none;
    background: #ffffff;
    color: #0a0a0a;
}
.shipping-calculator-form input:focus,
.shipping-calculator-form select:focus {
    border-color: var(--color-secondary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-secondary) 10%, transparent);
}
.shipping-calculator-form button {
    background: var(--color-button);
    color: var(--color-button-text);
    padding: 10px 24px;
    border-radius: 0;
    font-weight: 700;
    font-size: 13px;
    border: none;
    cursor: pointer;
    transition: all .2s;
}
.shipping-calculator-form button:hover {
    background: var(--color-button-dark);
    color: var(--color-button-text);
}
.woocommerce-checkout #payment ul.payment_methods {
    list-style: none;
    padding: 0;
    margin: 0;
}
.woocommerce-checkout #payment div.payment_box {
    padding: 12px 16px;
    background: #ffffff;
    border-radius: 0;
    margin-top: 4px;
    font-size: 13px;
    color: #767790;
}
.woocommerce-checkout #payment div.payment_box p {
    margin: 0;
}
.woocommerce-checkout #payment div.payment_box p:last-child {
    margin-bottom: 0;
}
.woocommerce #ship-to-different-address label {
    font-weight: 500;
}
.woocommerce .woocommerce-terms-and-conditions-wrapper {
    margin-top: 16px;
}
.woocommerce .woocommerce-privacy-policy-text {
    font-size: 12px;
    color: #767790;
    margin-bottom: 12px;
}
.woocommerce .woocommerce-privacy-policy-text a {
    color: var(--color-secondary);
}
.woocommerce .blockUI.blockOverlay {
    background: #fff !important;
    opacity: .6 !important;
}
.woocommerce .blockUI.blockMsg::before {
    content: '';
    display: block;
    width: 24px;
    height: 24px;
    border: 3px solid #e5e7eb;
    border-top-color: var(--color-primary);
    border-radius: 0;
    animation: spin .6s linear infinite;
    margin: 0 auto;
}
@keyframes spin {
    to { transform: rotate(360deg); }
}
.woocommerce-invalid .form-row .required {
    color: #ef4444;
}
.woocommerce-invalid .form-row input,
.woocommerce-invalid .form-row select,
.woocommerce-invalid .form-row textarea {
    border-color: #ef4444 !important;
}
.woocommerce-validated .form-row input,
.woocommerce-validated .form-row select,
.woocommerce-validated .form-row textarea {
    border-color: #22c55e !important;
}
.scrollbar-thin::-webkit-scrollbar {
    width: 4px;
    height: 4px;
}
.scrollbar-thin::-webkit-scrollbar-track {
    background: transparent;
}
.scrollbar-thin::-webkit-scrollbar-thumb {
    background: #c4c8cf;
    border-radius: 0;
}
.scrollbar-thin::-webkit-scrollbar-thumb:hover {
    background: #9e9fb1;
}
/* Title Tag overrides for specific cases */
.title-tag.angle-right .title-tag-img1 {
    order: 1;
}
.title-tag.angle-right .title-tag-img2 {
    order: -1;
}
/* ----------------------------------------------- /woocommerce form overrides ----------------------------------------- */

/* ----------------------------------------------- latest products grid ----------------------------------------- */
.products-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.products-grid .product:hover,
.products-grid .product:focus-within {
    box-shadow: none !important;
    transform: none !important;
}

.products-grid .card-swiper-btn-prev,
.products-grid .card-swiper-btn-next {
    box-shadow: none;
}

.lp-filter-btn {
    background: transparent;
    border: 1px solid #363636;
    color: #363636;
    border-radius: 0;
    padding: 1px 24px;
    font-size: 15px;
    line-height: 40px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    transition: all .3s;
}

.lp-filter-btn:hover {
    box-shadow: 0 2px 10px 2px rgba(0, 0, 0, .06);
}

@media (max-width: 767px) {
    .products-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }
}
/* ----------------------------------------------- /latest products grid ----------------------------------------- */

/* ----------------------------------------------- latest blog grid ----------------------------------------- */
.blog-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

/* single blog: sidebar (TOC) on the right column in RTL layout */
@media (min-width: 1024px) {
    .single-lg-sidebar {
        order: -1;
    }
}

/* The header is position:fixed and reaches 102px down (top:34px + height:68px),
   so the sidebar's Tailwind `top-24` (96px) parked its top edge 6px *behind* the
   header. Push it down to 128px for a real gap below the header. */
.single-lg-sidebar .sticky {
    top: 128px;
}

@media (max-width: 767px) {
    .blog-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }
}
/* ----------------------------------------------- /latest blog grid ----------------------------------------- */

/* ===== Product Gallery Slider ===== */
.product-gallery-wrapper .swiper {
    touch-action: pan-y;
}
.product-gallery-wrapper .swiper-slide {
    user-select: none;
    -webkit-user-select: none;
    /* The hover-zoom scales the image to 1.8x, which overflows its own slide.
       Without this the overflow escapes into the frame and paints over the
       neighbouring slide, so the frame shows part of two photos at once. */
    overflow: hidden;
}
.product-gallery-wrapper .swiper-slide img {
    pointer-events: auto;
    transition: transform 0.3s ease;
}
.product-gallery-wrapper .gallery-nav {
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}
@media (max-width: 767px) {
    .product-gallery-wrapper .gallery-nav {
        opacity: 1 !important;
        width: 36px;
        height: 36px;
    }
    .product-gallery-wrapper .gallery-nav svg {
        width: 18px;
        height: 18px;
    }
    .product-gallery-wrapper {
        -webkit-touch-callout: none;
    }
}

/* Related-products carousel slides (single-product.php, `#related-track`).
   The markup only carries `min-w-[calc(50%-8px)] md:min-w-[calc(25%-18px)]`, and a
   min-width is only a FLOOR: a flex item's used width is max(min-width, max-content).
   Each card contains a self-measuring Swiper (`.product-card-swiper`), i.e. a flex row
   of `width:100%` slides, so the card's max-content is driven by what Swiper last
   measured on the container - and Swiper's inline widths feed straight back into it.
   The two grow together without bound: measured cards 3002px wide inside a 354px
   carousel, clipped by `overflow:hidden` into one giant blank box.
   A definite flex-basis breaks the loop because the width no longer depends on the
   content; `min-width: 0` also neutralises the layered `min-w-[...]` utilities.
   Values mirror the utilities they replace: 2 per row below `md`, 4 per row at `md`+.
   The carousel JS reads the slide width back off the DOM (`[class*="min-w-"]`), so it
   keeps working without changes. */
#related-track > div {
    flex: 0 0 calc(50% - 8px);
    min-width: 0;
}
@media (min-width: 768px) {
    #related-track > div {
        flex: 0 0 calc(25% - 18px);
    }
}