/**
 * Top Categories (home4) — slider inset, nav, and card layout
 * Loaded after homepage_v4.css to override global owl-carousel nav rules.
 */
#tnfTopCategories.tnf-top-categories-home4,
.tnf-top-categories-home4#tnfTopCategories,
section.tnf-top-categories-home4 {
    --tnf-cat-section-inset: clamp(0.75rem, 2vw, 1.5rem);
    --tnf-cat-track-max: min(1720px, calc(100vw - 2rem));
    --tnf-cat-card-min-h: 168px;
    --tnf-cat-icon-size: 46px;
    --tnf-cat-nav-size: 52px;
    --tnf-cat-nav-gap: 0.625rem;
    display: block !important;
    visibility: visible !important;
    background: #eceffd !important;
    padding: clamp(2.5rem, 4vw, 3.5rem) var(--tnf-cat-section-inset) !important;
    margin: 0 !important;
    overflow: visible;
    position: relative;
    z-index: 5;
}

#tnfTopCategories > .container,
.tnf-top-categories-home4 > .container {
    max-width: var(--tnf-cat-track-max) !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

#tnfTopCategories .tnf-top-categories-home4__slider-shell,
.tnf-top-categories-home4 .tnf-top-categories-home4__slider-shell {
    position: relative;
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    padding-left: calc(var(--tnf-cat-nav-size) + var(--tnf-cat-nav-gap)) !important;
    padding-right: calc(var(--tnf-cat-nav-size) + var(--tnf-cat-nav-gap)) !important;
    box-sizing: border-box;
    overflow: visible;
}

/* Owl hides .owl-nav entirely when all items fit — keep arrows visible for category slider */
#tnfTopCategories .category-slider.owl-carousel .owl-nav.disabled,
.tnf-top-categories-home4 .category-slider.owl-carousel .owl-nav.disabled {
    display: block !important;
    pointer-events: none;
}

#tnfTopCategories .category-slider.owl-carousel .owl-nav.disabled button,
.tnf-top-categories-home4 .category-slider.owl-carousel .owl-nav.disabled button {
    opacity: 0.35;
    cursor: not-allowed;
}

#tnfTopCategories .category-slider,
.tnf-top-categories-home4 .category-slider {
    position: relative;
    width: 100%;
    margin: 0;
    padding-left: 0 !important;
    padding-right: 0 !important;
    overflow: visible;
}

/* Clip sliding track — overrides homepage_v4 .owl-stage-outer { overflow: visible } */
#tnfTopCategories .category-slider.owl-carousel .owl-stage-outer,
.tnf-top-categories-home4 .category-slider.owl-carousel .owl-stage-outer {
    overflow: hidden !important;
    width: 100%;
}

#tnfTopCategories .category-slider.owl-carousel .owl-stage,
.tnf-top-categories-home4 .category-slider.owl-carousel .owl-stage {
    display: flex;
    touch-action: pan-y;
}

#tnfTopCategories .category-slider.owl-carousel:not(.owl-loaded),
.tnf-top-categories-home4 .category-slider.owl-carousel:not(.owl-loaded) {
    display: flex !important;
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 1.25rem;
    padding: 0.25rem 0 1rem !important;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
}

#tnfTopCategories .category-slider.owl-carousel:not(.owl-loaded) .category-item,
.tnf-top-categories-home4 .category-slider.owl-carousel:not(.owl-loaded) .category-item {
    flex: 0 0 140px;
    min-width: 140px;
    scroll-snap-align: start;
}

#tnfTopCategories .category-slider.owl-carousel.owl-loaded,
.tnf-top-categories-home4 .category-slider.owl-carousel.owl-loaded {
    display: block !important;
}

/* Show all items in the track (homepage_v4 hides non-.active); clipping is via stage-outer */
#tnfTopCategories .category-slider.owl-carousel .owl-item,
.tnf-top-categories-home4 .category-slider.owl-carousel .owl-item {
    opacity: 1 !important;
    visibility: visible !important;
}

#tnfTopCategories .category-slider.owl-carousel .owl-item .category-item,
.tnf-top-categories-home4 .category-slider.owl-carousel .owl-item .category-item {
    width: 100%;
    box-sizing: border-box;
}

#tnfTopCategories .category-item,
.tnf-top-categories-home4 .category-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 100%;
    min-height: var(--tnf-cat-card-min-h, 168px);
    aspect-ratio: 1;
    min-width: 0;
    padding: 1.5rem 1rem 1.25rem;
    border-radius: 16px !important;
    background: var(--system_primery_color, #1f2b40) !important;
    background-size: auto 200% !important;
    box-shadow: 0 6px 18px rgba(31, 43, 64, 0.12);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    text-decoration: none;
}

#tnfTopCategories .category-item-icon,
.tnf-top-categories-home4 .category-item-icon {
    width: var(--tnf-cat-icon-size, 46px);
    height: var(--tnf-cat-icon-size, 46px);
    margin-bottom: 1rem;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

#tnfTopCategories .category-item-icon img,
.tnf-top-categories-home4 .category-item-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

#tnfTopCategories .category-item-content h6,
.tnf-top-categories-home4 .category-item-content h6 {
    color: #fff !important;
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.3;
    margin: 0 0 0.25rem;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-break: break-word;
}

#tnfTopCategories .category-item-content p,
.tnf-top-categories-home4 .category-item-content p {
    color: #fff !important;
    font-size: 0.75rem !important;
    line-height: 1.25;
    opacity: 0.88;
    margin: 0;
}

/* Owl nav — override homepage_v4 off-screen positioning */
#tnfTopCategories .category-slider .owl-nav,
.tnf-top-categories-home4 .category-slider .owl-nav {
    margin: 0 !important;
    --btn-position: 0 !important;
    --btn-width: var(--tnf-cat-nav-size) !important;
}

#tnfTopCategories .category-slider .owl-nav button svg,
.tnf-top-categories-home4 .category-slider .owl-nav button svg {
    width: 22px;
    height: auto;
    display: block;
    flex-shrink: 0;
    pointer-events: none;
}

#tnfTopCategories .category-slider .owl-nav button,
#tnfTopCategories .category-slider .owl-nav > div,
.tnf-top-categories-home4 .category-slider .owl-nav button,
.tnf-top-categories-home4 .category-slider .owl-nav > div {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    left: auto !important;
    right: auto !important;
    width: var(--tnf-cat-nav-size) !important;
    height: var(--tnf-cat-nav-size) !important;
    min-width: var(--tnf-cat-nav-size) !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 50% !important;
    background: #fff !important;
    background-color: #fff !important;
    background-image: none !important;
    color: #1f2b40 !important;
    border: none !important;
    box-shadow: 0 4px 18px rgba(31, 43, 64, 0.12);
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 3;
}

#tnfTopCategories .category-slider .owl-nav .owl-prev,
#tnfTopCategories .category-slider .owl-nav button.owl-prev,
#tnfTopCategories .category-slider .owl-nav > div.owl-prev,
#tnfTopCategories .category-slider .owl-nav button:first-child,
#tnfTopCategories .category-slider .owl-nav > div:first-child,
.tnf-top-categories-home4 .category-slider .owl-nav .owl-prev,
.tnf-top-categories-home4 .category-slider .owl-nav button:first-child,
.tnf-top-categories-home4 .category-slider .owl-nav > div:first-child {
    left: calc(-1 * (var(--tnf-cat-nav-size) + var(--tnf-cat-nav-gap))) !important;
    right: auto !important;
}

#tnfTopCategories .category-slider .owl-nav .owl-next,
#tnfTopCategories .category-slider .owl-nav button.owl-next,
#tnfTopCategories .category-slider .owl-nav > div.owl-next,
#tnfTopCategories .category-slider .owl-nav button:last-child,
#tnfTopCategories .category-slider .owl-nav > div:last-child,
.tnf-top-categories-home4 .category-slider .owl-nav .owl-next,
.tnf-top-categories-home4 .category-slider .owl-nav button:last-child,
.tnf-top-categories-home4 .category-slider .owl-nav > div:last-child {
    left: auto !important;
    right: calc(-1 * (var(--tnf-cat-nav-size) + var(--tnf-cat-nav-gap))) !important;
}

html[dir="rtl"] #tnfTopCategories .category-slider .owl-nav .owl-prev,
html[dir="rtl"] #tnfTopCategories .category-slider .owl-nav button:first-child,
html[dir="rtl"] .tnf-top-categories-home4 .category-slider .owl-nav .owl-prev,
html[dir="rtl"] .tnf-top-categories-home4 .category-slider .owl-nav button:first-child {
    left: auto !important;
    right: calc(-1 * (var(--tnf-cat-nav-size) + var(--tnf-cat-nav-gap))) !important;
    margin-right: 0 !important;
    transform: translateY(-50%) !important;
}

html[dir="rtl"] #tnfTopCategories .category-slider .owl-nav .owl-next,
html[dir="rtl"] #tnfTopCategories .category-slider .owl-nav button:last-child,
html[dir="rtl"] .tnf-top-categories-home4 .category-slider .owl-nav .owl-next,
html[dir="rtl"] .tnf-top-categories-home4 .category-slider .owl-nav button:last-child {
    right: auto !important;
    left: calc(-1 * (var(--tnf-cat-nav-size) + var(--tnf-cat-nav-gap))) !important;
    transform: translateY(-50%) !important;
}

@media (min-width: 1200px) {
    #tnfTopCategories.tnf-top-categories-home4,
    .tnf-top-categories-home4 {
        --tnf-cat-section-inset: clamp(1rem, 2.5vw, 2rem);
        --tnf-cat-track-max: min(1760px, calc(100vw - 2.5rem));
        --tnf-cat-nav-size: 56px;
    }
}

@media (max-width: 991.98px) {
    #tnfTopCategories.tnf-top-categories-home4,
    .tnf-top-categories-home4 {
        --tnf-cat-section-inset: clamp(1.25rem, 5vw, 2.5rem);
    }
}

@media (max-width: 767.98px) {
    #tnfTopCategories .tnf-top-categories-home4__slider-shell,
    .tnf-top-categories-home4 .tnf-top-categories-home4__slider-shell {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}