/* ============================================================
   JOVIO PRODUCT CARDS
   Presentation only — no cart/business logic
   ============================================================ */

.product-item {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    margin-bottom: 24px !important;
    background: #fff;
    border: 1px solid #ececf3;
    border-radius: 16px;
    box-shadow: none !important;
    overflow: hidden;
    transition:
        transform .2s ease,
        border-color .2s ease;
}

.product-item:hover {
    transform: translateY(-2px);
    border-color: rgba(116,112,181,.35);
}


/* ---------------- IMAGE ---------------- */

.product-item .product-thumb {
    width: 100%;
    min-height: 0 !important;
    aspect-ratio: 1 / 1;
    padding: 14px;
    background: #fff;
    border-radius: 0 !important;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.product-item .product-thumb > a.jovio-card-image-zoom {
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
    cursor: zoom-in;
}

.product-item .product-thumb > a.jovio-card-image-zoom > img {
    display: block;
    width: 100%;
    height: 100% !important;
    max-height: none !important;
    object-fit: contain;
    transition: transform .25s ease;
}

.product-item:hover
.product-thumb > a.jovio-card-image-zoom > img {
    transform: scale(1.025);
}


/* Old floating icons are not needed anymore.
   The original cart action itself is moved below the product by JS. */
.product-item .product-thumb .product-action {
    display: none !important;
}


/* ---------------- PRODUCT INFO ---------------- */

.product-item .product-info {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 94px !important;
    padding: 10px 14px 8px !important;
    background: #fff;
    border-radius: 0 !important;
}

.product-item .product-info .title {
    margin: 0 0 8px !important;
    min-height: 44px;
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.45 !important;

    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.product-item .product-info .title a {
    color: #292934 !important;
    text-decoration: none;
}

.product-item .product-info .title a:hover {
    color: var(--primaryColor) !important;
}

.product-item .product-info .prices {
    align-items: center;
    gap: 8px;
    margin-top: auto !important;
    min-height: 26px;
}

.product-item .product-info .prices .price {
    margin: 0;
    font-size: 15px !important;
    line-height: 1.4;
    font-weight: 600 !important;
    color: #3b3a3a !important;
}


/* ---------------- ADD TO CART ---------------- */

.jovio-card-footer {
    margin-top: auto;
    padding: 2px 14px 14px;
}

.jovio-card-add {
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 7px;

    width: 100%;
    min-height: 42px;
    padding: 8px 12px;

    background: var(--primaryColor);
    border: 1px solid var(--primaryColor);
    border-radius: 10px;

    color: #fff !important;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none !important;

    transition:
        background-color .2s ease,
        border-color .2s ease,
        transform .2s ease;
}

.jovio-card-add:hover,
.jovio-card-add:focus {
    color: #fff !important;
    background: var(--secondaryColor);
    border-color: var(--secondaryColor);
}

.jovio-card-add:active {
    transform: scale(.985);
}

.jovio-card-add i,
.jovio-card-add .ion-ios-cart {
    font-size: 18px;
    line-height: 1;
}


/* ---------------- SOLD OUT BADGE ---------------- */

.product-item .out-stock-badge {
    z-index: 3;
}


/* ---------------- DESKTOP GRID ---------------- */

.product > .row > [class*="col-"] {
    display: flex;
}

.product > .row > [class*="col-"] > .product-item {
    width: 100%;
}


/* ---------------- RELATED PRODUCTS SLIDER ---------------- */

.product-tab1-slider .product-item {
    height: auto;
}


/* ---------------- MOBILE ---------------- */

@media (max-width: 767px) {

    /* Always 2 products per row in regular product grids */
    .product > .row > [class*="col-"] {
        flex: 0 0 50% !important;
        width: 50% !important;
        max-width: 50% !important;
        padding-left: 6px !important;
        padding-right: 6px !important;
    }

    .product > .row {
        margin-left: -6px;
        margin-right: -6px;
    }

    .product-item {
        margin-bottom: 12px !important;
        border-radius: 12px;
    }

    .product-item .product-thumb {
        padding: 8px;
    }

    .product-item .product-info {
        min-height: 82px !important;
        padding: 8px 9px 6px !important;
    }

    .product-item .product-info .title {
        min-height: 38px;
        margin-bottom: 5px !important;
        font-size: 13px !important;
        line-height: 1.45 !important;
    }

    .product-item .product-info .prices {
        gap: 4px;
        flex-wrap: wrap;
    }

    .product-item .product-info .prices .price {
        font-size: 12px !important;
    }

    .jovio-card-footer {
        padding: 2px 9px 9px;
    }

    .jovio-card-add {
        min-height: 35px;
        padding: 6px 5px;
        border-radius: 8px;
        gap: 4px;
        font-size: 11px;
    }

    .jovio-card-add i,
    .jovio-card-add .ion-ios-cart {
        font-size: 15px;
    }
}

/* ============================================================
   GRID SPACING FIX
   ============================================================ */

.product > .row {
    row-gap: 22px;
}

.product > .row > [class*="col-"] {
    padding-left: 10px !important;
    padding-right: 10px !important;
    margin-bottom: 0 !important;
}

.product-item {
    margin-bottom: 0 !important;
}

/* Related products slider keeps its own spacing */
.product-tab1-slider .product-item {
    margin-left: 8px;
    margin-right: 8px;
}

/* Mobile: compact but still visibly separated */
@media (max-width: 767px) {

    .product > .row {
        margin-left: -5px !important;
        margin-right: -5px !important;
        row-gap: 10px;
    }

    .product > .row > [class*="col-"] {
        padding-left: 5px !important;
        padding-right: 5px !important;
    }

    .product-item {
        margin-bottom: 0 !important;
    }
}


/* ============================================================
   JOVIO — NEW PRODUCTS CATEGORY CARDS
   UI ONLY
   ============================================================ */

.product-tab-content .nav-tabs {
    border: 0 !important;
    margin: 0 0 34px !important;
    padding: 4px !important;

    display: grid !important;
    grid-template-columns: repeat(7, minmax(105px, 1fr));
    gap: 12px;

    align-items: stretch;
    justify-content: center;

    background: transparent;
}

.product-tab-content .nav-tabs .nav-item {
    margin: 0 !important;
    padding: 0 !important;
    min-width: 0;

    opacity: 0;
    transform: translateY(10px);

    animation:
        jovioCategoryCardIn .45s ease forwards;
}

.product-tab-content .nav-tabs .nav-item:nth-child(1) {
    animation-delay: .02s;
}

.product-tab-content .nav-tabs .nav-item:nth-child(2) {
    animation-delay: .06s;
}

.product-tab-content .nav-tabs .nav-item:nth-child(3) {
    animation-delay: .10s;
}

.product-tab-content .nav-tabs .nav-item:nth-child(4) {
    animation-delay: .14s;
}

.product-tab-content .nav-tabs .nav-item:nth-child(5) {
    animation-delay: .18s;
}

.product-tab-content .nav-tabs .nav-item:nth-child(6) {
    animation-delay: .22s;
}

.product-tab-content .nav-tabs .nav-item:nth-child(7) {
    animation-delay: .26s;
}

.product-tab-content .nav-tabs .nav-item:nth-child(8) {
    animation-delay: .30s;
}

.product-tab-content .nav-tabs .nav-item:nth-child(9) {
    animation-delay: .34s;
}

.product-tab-content .nav-tabs .nav-item:nth-child(10) {
    animation-delay: .38s;
}


/* CATEGORY CARD */

.product-tab-content .nav-tabs .nav-link {
    position: relative;

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

    width: 100%;
    min-height: 54px;

    margin: 0 !important;
    padding: 10px 14px !important;

    border: 1px solid #e8e8f0 !important;
    border-radius: 14px !important;

    background: #fff !important;
    color: #44434d !important;

    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.25 !important;

    white-space: nowrap;

    box-shadow:
        0 3px 12px rgba(30, 30, 60, .035);

    transition:
        transform .2s ease,
        border-color .2s ease,
        background-color .2s ease,
        color .2s ease,
        box-shadow .2s ease;
}


/* small decorative dot */

.product-tab-content .nav-tabs .nav-link::before {
    content: "";

    width: 7px;
    height: 7px;

    margin-inline-end: 8px;

    flex: 0 0 7px;

    border-radius: 50%;

    background: #ddddea;

    transition:
        background-color .2s ease,
        transform .2s ease;
}


/* HOVER */

@media (hover: hover) {

    .product-tab-content .nav-tabs .nav-link:hover {
        transform: translateY(-3px);

        border-color: rgba(116,112,181,.45) !important;

        color: var(--primaryColor) !important;

        box-shadow:
            0 8px 22px rgba(50, 45, 100, .09);
    }

    .product-tab-content .nav-tabs .nav-link:hover::before {
        background: var(--primaryColor);
        transform: scale(1.25);
    }
}


/* ACTIVE CATEGORY */

.product-tab-content .nav-tabs .nav-link.active,
.product-tab-content .nav-tabs .nav-link.active:hover {
    color: #fff !important;

    border-color: var(--primaryColor) !important;

    background:
        linear-gradient(
            135deg,
            var(--primaryColor),
            #8580cf
        ) !important;

    box-shadow:
        0 8px 20px rgba(116,112,181,.22);

    transform: translateY(-2px);
}

.product-tab-content .nav-tabs .nav-link.active::before {
    background: #fff;
    transform: scale(1.15);
}


/* CLICK FEEDBACK */

.product-tab-content .nav-tabs .nav-link:active {
    transform: scale(.97);
}


/* ANIMATION */

@keyframes jovioCategoryCardIn {

    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/* ============================================================
   TABLET
   ============================================================ */

@media (max-width: 1199px) {

    .product-tab-content .nav-tabs {
        grid-template-columns:
            repeat(4, minmax(120px, 1fr));
    }

}


/* ============================================================
   MOBILE
   One horizontal row — swipe right/left
   ============================================================ */

@media (max-width: 767px) {

    .product-tab-content .nav-tabs {
        display: flex !important;

        flex-wrap: nowrap !important;

        justify-content: flex-start !important;

        gap: 8px !important;

        width: calc(100% + 24px);

        margin:
            0 -12px 22px !important;

        padding:
            6px 12px 10px !important;

        overflow-x: auto;
        overflow-y: hidden;

        scroll-snap-type: x proximity;

        -webkit-overflow-scrolling: touch;

        scrollbar-width: none;
    }

    .product-tab-content .nav-tabs::-webkit-scrollbar {
        display: none;
    }

    .product-tab-content .nav-tabs .nav-item {
        flex:
            0 0 auto !important;

        width: auto !important;

        scroll-snap-align: start;
    }

    .product-tab-content .nav-tabs .nav-link {
        width: auto !important;

        min-width: 105px;
        min-height: 46px;

        padding:
            8px 12px !important;

        border-radius: 12px !important;

        font-size: 12px !important;

        box-shadow:
            0 3px 10px rgba(30,30,60,.035);
    }

    .product-tab-content .nav-tabs .nav-link::before {
        width: 6px;
        height: 6px;

        flex-basis: 6px;

        margin-inline-end: 6px;
    }

    .product-tab-content .nav-tabs .nav-link.active {
        box-shadow:
            0 5px 14px rgba(116,112,181,.20);
    }
}


/* ============================================================
   VERY SMALL PHONES
   ============================================================ */

@media (max-width: 390px) {

    .product-tab-content .nav-tabs .nav-link {
        min-width: 98px;

        padding:
            8px 10px !important;

        font-size: 11px !important;
    }

}


/* ============================================================
   JOVIO_PRODUCT_POLISH_V2
   Typography + two-line titles + spacing + clean slider arrows
   ============================================================ */


/* ------------------------------------------------------------
   SITE TYPOGRAPHY NORMALIZATION
   Keep current font families; improve hierarchy/readability.
   ------------------------------------------------------------ */

body {
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body,
button,
input,
select,
textarea {
    line-height: 1.6;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 700;
    line-height: 1.35;
}

button,
.btn,
.nav-link {
    font-weight: 600;
}


/* ------------------------------------------------------------
   PRODUCT CARD — MORE COMPACT
   ------------------------------------------------------------ */

.product-item {
    cursor: pointer;
}

/* Square boxes were making cards unnecessarily tall */
.product-item .product-thumb {
    aspect-ratio: 4 / 3 !important;
    min-height: 0 !important;
    padding: 12px !important;
}

.product-item .product-info {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;

    min-height: 112px !important;

    padding:
        13px 15px 9px !important;

    text-align: start !important;
}


/* ------------------------------------------------------------
   PRODUCT TITLE — FULL TEXT, MAXIMUM TWO LINES
   ------------------------------------------------------------ */

.product-item .product-info .title {
    width: 100%;

    min-height: 48px !important;
    max-height: 48px;

    margin:
        0 0 8px !important;

    padding: 0;

    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.6 !important;

    letter-spacing: 0;

    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;

    overflow: hidden;
    text-overflow: ellipsis;

    text-align: start !important;
}

.product-item .product-info .title a {
    display: block;

    width: 100%;

    color: #25252d !important;

    font-weight: 700 !important;
    line-height: inherit;

    text-decoration: none !important;
}


/* Arabic must sit on the right */

html[lang="ar"] .product-item .product-info,
html[lang="ar"] .product-item .product-info .title,
html[lang="ar"] .product-item .product-info .title a {
    direction: rtl;
    text-align: right !important;
}


/* English stays left */

html[lang="en"] .product-item .product-info,
html[lang="en"] .product-item .product-info .title,
html[lang="en"] .product-item .product-info .title a {
    direction: ltr;
    text-align: left !important;
}


/* ------------------------------------------------------------
   PRICE — CLEARER / HEAVIER
   ------------------------------------------------------------ */

.product-item .product-info .prices {
    width: 100%;

    min-height: 27px;

    margin: auto 0 0 !important;

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

    gap: 7px;
}

.product-item .product-info .prices .price {
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;

    color: #24242c !important;
}

.product-item .product-info .prices .text-danger {
    opacity: .72;

    font-size: 13px !important;
    font-weight: 600 !important;
}


/* ------------------------------------------------------------
   ADD TO CART
   ------------------------------------------------------------ */

.jovio-card-footer {
    padding:
        3px 15px 14px !important;
}

.jovio-card-add {
    font-weight: 700 !important;
}


/* ------------------------------------------------------------
   NEW PRODUCTS SECTION SPACING
   ------------------------------------------------------------ */

.jovio-new-products-section {
    padding-top: 48px !important;
}

.jovio-new-products-section .section-title {
    margin-bottom: 24px !important;
}

.jovio-new-products-section .section-title .title,
.jovio-new-products-section h2.title,
.jovio-new-products-section h3.title,
.jovio-new-products-section h4.title {
    margin-bottom: 0 !important;

    font-size: 22px !important;
    font-weight: 700 !important;
    line-height: 1.45 !important;

    color: #202028;
}

/* category cards -> products spacing */
.jovio-new-products-section .product-tab-content .nav-tabs {
    margin-bottom: 30px !important;
}


/* ============================================================
   CLEAN SLICK NAVIGATION
   Remove old blue flower/image arrows.
   ============================================================ */

.product-tab1-slider {
    position: relative;
}

.product-tab1-slider .slick-prev,
.product-tab1-slider .slick-next {
    position: absolute;

    width: 42px !important;
    height: 42px !important;

    padding: 0 !important;

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

    border: 1px solid #e4e4ec !important;
    border-radius: 50% !important;

    background: #fff !important;

    box-shadow:
        0 5px 18px rgba(36, 34, 80, .10) !important;

    opacity: 1 !important;

    font-size: 0 !important;

    z-index: 20;

    transition:
        background-color .2s ease,
        border-color .2s ease,
        transform .2s ease,
        box-shadow .2s ease;
}

.product-tab1-slider .slick-prev::before,
.product-tab1-slider .slick-next::before {
    display: none !important;
    content: none !important;
}


/* kill old image backgrounds */
.product-tab1-slider .slick-prev::after,
.product-tab1-slider .slick-next::after {
    position: static !important;

    display: block !important;

    width: auto !important;
    height: auto !important;

    background-image: none !important;
    background: none !important;

    color: var(--primaryColor);

    font-family: Arial, sans-serif !important;
    font-size: 28px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
}

.product-tab1-slider .slick-prev::after {
    content: "‹" !important;
}

.product-tab1-slider .slick-next::after {
    content: "›" !important;
}


@media (hover: hover) {

    .product-tab1-slider .slick-prev:hover,
    .product-tab1-slider .slick-next:hover {
        background: var(--primaryColor) !important;
        border-color: var(--primaryColor) !important;

        transform: scale(1.06);

        box-shadow:
            0 7px 20px rgba(116,112,181,.25) !important;
    }

    .product-tab1-slider .slick-prev:hover::after,
    .product-tab1-slider .slick-next:hover::after {
        color: #fff !important;
        background-image: none !important;
    }
}


/* ------------------------------------------------------------
   MOBILE
   ------------------------------------------------------------ */

@media (max-width: 767px) {

    .product-item .product-thumb {
        aspect-ratio: 4 / 3 !important;
        padding: 7px !important;
    }

    .product-item .product-info {
        min-height: 101px !important;

        padding:
            9px 9px 6px !important;
    }

    .product-item .product-info .title {
        min-height: 44px !important;
        max-height: 44px;

        margin-bottom: 5px !important;

        font-size: 13px !important;
        font-weight: 700 !important;
        line-height: 1.65 !important;
    }

    .product-item .product-info .prices .price {
        font-size: 13px !important;
        font-weight: 700 !important;
    }

    .product-item .product-info .prices .text-danger {
        font-size: 11px !important;
    }

    .jovio-card-footer {
        padding:
            2px 9px 9px !important;
    }

    .jovio-card-add {
        font-size: 11px !important;
        font-weight: 700 !important;
    }

    .jovio-new-products-section {
        padding-top: 34px !important;
    }

    .jovio-new-products-section .section-title {
        margin-bottom: 18px !important;
    }

    .jovio-new-products-section .section-title .title,
    .jovio-new-products-section h2.title,
    .jovio-new-products-section h3.title,
    .jovio-new-products-section h4.title {
        font-size: 18px !important;
    }

    .jovio-new-products-section .product-tab-content .nav-tabs {
        margin-bottom: 20px !important;
    }

    .product-tab1-slider .slick-prev,
    .product-tab1-slider .slick-next {
        width: 34px !important;
        height: 34px !important;
    }

    .product-tab1-slider .slick-prev::after,
    .product-tab1-slider .slick-next::after {
        font-size: 23px !important;
    }
}


/* ============================================================
   JOVIO_MOBILE_CATEGORY_GRID_V1
   Price visibility + category typography + mobile 3 x 2 grid
   ============================================================ */


/* ------------------------------------------------------------
   PRICE — STRONGER AND EASIER TO READ
   ------------------------------------------------------------ */

.product-item .product-info .prices {
    min-height: 30px !important;
}

.product-item .product-info .prices .price {
    font-size: 18px !important;
    font-weight: 800 !important;
    line-height: 1.35 !important;

    color: #202028 !important;
}

.product-item .product-info .prices .price.text-danger,
.product-item .product-info .prices .text-danger {
    font-size: 14px !important;
    font-weight: 650 !important;

    color: #d9534f !important;
    opacity: .82;
}


/* ------------------------------------------------------------
   CATEGORY CARD TYPOGRAPHY — DESKTOP
   ------------------------------------------------------------ */

.product-tab-content .nav-tabs .nav-link {
    min-height: 58px;

    padding:
        12px 14px !important;

    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;

    color: #34343d !important;
}

.product-tab-content .nav-tabs .nav-link.active {
    font-weight: 750 !important;
}


/* ------------------------------------------------------------
   VIEW MORE BUTTON
   Desktop hidden
   ------------------------------------------------------------ */

.jovio-categories-more {
    display: none;
}


/* ============================================================
   MOBILE CATEGORY GRID
   First 6 = 2 rows × 3 cards
   ============================================================ */

@media (max-width: 767px) {

    /*
     * Cancel the previous horizontal-scroll design.
     */
    .product-tab-content .nav-tabs {
        display: grid !important;

        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;

        gap: 8px !important;

        width: 100% !important;

        margin:
            0 0 12px !important;

        padding:
            0 !important;

        overflow: visible !important;

        scroll-snap-type: none !important;
    }


    .product-tab-content .nav-tabs .nav-item {
        width: 100% !important;

        min-width: 0 !important;

        flex: none !important;

        margin: 0 !important;
    }


    /*
     * Only first 6 are visible by default.
     */
    .product-tab-content
    .nav-tabs:not(.jovio-categories-expanded)
    .nav-item:nth-child(n+7) {
        display: none !important;
    }


    /*
     * Additional categories appear smoothly after View More.
     */
    .product-tab-content
    .nav-tabs.jovio-categories-expanded
    .nav-item:nth-child(n+7) {
        display: block !important;

        animation:
            jovioCategoryReveal .28s ease both;
    }


    .product-tab-content .nav-tabs .nav-link {
        width: 100% !important;

        min-width: 0 !important;
        min-height: 52px !important;

        padding:
            8px 5px !important;

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

        border-radius: 11px !important;

        font-size: 13px !important;
        font-weight: 700 !important;
        line-height: 1.35 !important;

        white-space: normal !important;

        text-align: center !important;
    }


    /*
     * Dot is kept subtle so the text remains the focus.
     */
    .product-tab-content
    .nav-tabs
    .nav-link::before {
        width: 5px;
        height: 5px;

        flex:
            0 0 5px;

        margin-inline-end: 5px;
    }


    /* --------------------------------------------
       VIEW MORE / SHOW LESS
       -------------------------------------------- */

    .jovio-categories-more {
        width: fit-content;

        min-width: 145px;
        min-height: 40px;

        margin:
            6px auto 22px;

        padding:
            8px 17px;

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

        gap: 8px;

        border:
            1px solid rgba(116,112,181,.24);

        border-radius: 999px;

        background: #fff;

        color: var(--primaryColor);

        font-size: 13px;
        font-weight: 700;
        line-height: 1.2;

        box-shadow:
            0 4px 13px rgba(40,38,90,.06);

        cursor: pointer;

        transition:
            border-color .2s ease,
            background-color .2s ease,
            color .2s ease,
            transform .2s ease,
            box-shadow .2s ease;
    }


    .jovio-categories-more:active {
        transform: scale(.97);
    }


    .jovio-categories-more-icon {
        display: inline-flex;

        align-items: center;
        justify-content: center;

        font-size: 19px;
        font-weight: 500;

        line-height: 1;

        transition:
            transform .22s ease;
    }


    .jovio-categories-more.is-open
    .jovio-categories-more-icon {
        transform: rotate(180deg);
    }


    /* --------------------------------------------
       MOBILE PRICE
       -------------------------------------------- */

    .product-item
    .product-info
    .prices
    .price {
        font-size: 15px !important;
        font-weight: 800 !important;
    }


    .product-item
    .product-info
    .prices
    .price.text-danger,
    .product-item
    .product-info
    .prices
    .text-danger {
        font-size: 12px !important;
        font-weight: 650 !important;
    }

}


/* ------------------------------------------------------------
   CATEGORY REVEAL ANIMATION
   ------------------------------------------------------------ */

@keyframes jovioCategoryReveal {

    from {
        opacity: 0;
        transform: translateY(-6px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/* ------------------------------------------------------------
   VERY SMALL PHONES
   Still 3 cards per row.
   ------------------------------------------------------------ */

@media (max-width: 390px) {

    .product-tab-content .nav-tabs {
        gap: 6px !important;
    }

    .product-tab-content
    .nav-tabs
    .nav-link {
        min-height: 49px !important;

        padding:
            7px 3px !important;

        font-size: 11.5px !important;
    }

    .product-tab-content
    .nav-tabs
    .nav-link::before {
        display: none;
    }

}



/* ============================================================
   JOVIO — VIEW MORE AS CLEAN TEXT
   ============================================================ */

@media (max-width: 767px) {

    .jovio-categories-more {
        width: auto !important;
        min-width: 0 !important;
        min-height: 0 !important;

        margin: 8px auto 24px !important;
        padding: 5px 2px !important;

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

        gap: 8px !important;

        border: 0 !important;
        border-radius: 0 !important;

        background: transparent !important;

        box-shadow: none !important;

        color: var(--primaryColor) !important;

        font-size: 14px !important;
        font-weight: 800 !important;
        line-height: 1.4 !important;

        cursor: pointer;

        transition:
            color .2s ease,
            opacity .2s ease,
            transform .2s ease;
    }

    .jovio-categories-more:hover {
        background: transparent !important;
        box-shadow: none !important;
        opacity: .82;
    }

    .jovio-categories-more:active {
        transform: scale(.97);
    }


    /* text */

    .jovio-categories-more-text {
        font-weight: 800 !important;
    }


    /* clean chevron */

    .jovio-categories-more-icon {
        width: 8px !important;
        height: 8px !important;

        display: block !important;

        flex: 0 0 8px;

        border-right: 2px solid currentColor;
        border-bottom: 2px solid currentColor;

        font-size: 0 !important;
        line-height: 0 !important;

        transform:
            rotate(45deg)
            translateY(-2px) !important;

        transition:
            transform .22s ease;
    }


    /* arrow up when expanded */

    .jovio-categories-more.is-open
    .jovio-categories-more-icon {
        transform:
            rotate(225deg)
            translate(-1px, -1px) !important;
    }

}


/* ============================================================
   JOVIO_GLOBAL_PRODUCT_GRID_V1

   Same card everywhere:
   home / category / sub-category / search / all products / AJAX
   ============================================================ */


/* Every normal grid column stretches its card equally */

.jovio-product-col {
    display: flex !important;
    align-items: stretch;

    margin-bottom: 20px;
}

.jovio-product-col > .product-item {
    width: 100%;
    height: 100%;

    margin-bottom: 0 !important;
}


/* Dynamic home/category AJAX rows */

.sub-products > .jovio-product-col,
.sub-products-container > .jovio-product-col,
[id^="category-container-"] > .jovio-product-col {
    display: flex !important;
}


/* ============================================================
   MOBILE — ALWAYS TWO PRODUCTS PER ROW
   ============================================================ */

@media (max-width: 767px) {

    .jovio-product-col {
        flex:
            0 0 50% !important;

        width: 50% !important;
        max-width: 50% !important;

        padding-left: 5px !important;
        padding-right: 5px !important;

        margin-bottom: 10px !important;
    }


    .jovio-product-col > .product-item {
        width: 100% !important;
        height: 100%;

        margin-bottom: 0 !important;
    }


    /*
     * Keep dynamic AJAX rows aligned even when they do not use
     * the old .product wrapper.
     */
    .row.sub-products,
    .row.sub-products-container,
    [id^="category-container-"].row {
        margin-left: -5px !important;
        margin-right: -5px !important;
    }

}



/* ============================================================
   JOVIO — PRODUCT IMAGE VISUAL BOOST
   Bigger product presentation without changing card/grid logic
   ============================================================ */

.product-item .product-thumb {
    padding: 3px !important;
    overflow: hidden !important;
}

.product-item
.product-thumb
> a.jovio-card-image-zoom {
    width: 100% !important;
    height: 100% !important;

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

    overflow: hidden !important;
}

.product-item
.product-thumb
> a.jovio-card-image-zoom
> img {
    width: 100% !important;
    height: 100% !important;

    max-width: none !important;
    max-height: none !important;

    object-fit: contain !important;

    transform: scale(1.10) !important;
    transform-origin: center center;

    transition:
        transform .25s ease !important;
}


/* Desktop hover — subtle only */

@media (hover: hover) {

    .product-item:hover
    .product-thumb
    > a.jovio-card-image-zoom
    > img {
        transform: scale(1.14) !important;
    }

}


/* Mobile — use almost the whole image area */

@media (max-width: 767px) {

    .product-item .product-thumb {
        padding: 1px !important;
    }

    .product-item
    .product-thumb
    > a.jovio-card-image-zoom
    > img {
        transform: scale(1.12) !important;
    }

}


/* Very small phones */

@media (max-width: 390px) {

    .product-item
    .product-thumb
    > a.jovio-card-image-zoom
    > img {
        transform: scale(1.10) !important;
    }

}


/* ============================================================
   JOVIO — PRODUCT WISHLIST HEART
   ============================================================ */

.product-item .product-thumb {
    position: relative !important;
}


.product-item
.product-thumb
.product-action {
    position: static !important;

    width: 0 !important;
    height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    display: block !important;

    opacity: 1 !important;
    visibility: visible !important;

    transform: none !important;

    pointer-events: none !important;
}


/* Hide old quick actions */

.product-item
.product-thumb
.product-action
> a {
    display: none !important;
}


/* Wishlist only */

.product-item
.product-thumb
.product-action
> .jovio-card-wishlist {
    position: absolute !important;

    top: 13px !important;
    left: 13px !important;
    right: auto !important;

    z-index: 20 !important;

    width: 42px !important;
    height: 42px !important;

    padding: 0 !important;
    margin: 0 !important;

    display: flex !important;

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

    border: 1px solid #ecebf3 !important;

    border-radius: 50% !important;

    background:
        rgba(255,255,255,.96) !important;

    color: #7773bc !important;

    font-size: 21px !important;

    box-shadow:
        0 6px 18px rgba(40,35,80,.10) !important;

    opacity: 1 !important;
    visibility: visible !important;

    transform: none !important;

    pointer-events: auto !important;

    text-decoration: none !important;

    transition:
        transform .2s ease,
        color .2s ease,
        background-color .2s ease,
        box-shadow .2s ease !important;
}


.product-item
.product-thumb
.product-action
> .jovio-card-wishlist:hover {
    transform:
        translateY(-2px) scale(1.04) !important;

    color: #ff5964 !important;

    box-shadow:
        0 9px 22px rgba(40,35,80,.15) !important;
}


.product-item
.product-thumb
.product-action
> .jovio-card-wishlist.is-added {
    color: #fff !important;

    border-color: #ff5964 !important;

    background: #ff5964 !important;
}


@media (max-width: 767px) {

    .product-item
    .product-thumb
    .product-action
    > .jovio-card-wishlist {
        top: 8px !important;
        left: 8px !important;

        width: 36px !important;
        height: 36px !important;

        font-size: 18px !important;

        box-shadow:
            0 4px 13px rgba(40,35,80,.11) !important;
    }

}

/* JOVIO — Wishlist heart logo color */

.product-item
.product-thumb
.product-action
> .jovio-card-wishlist {
    color: #F9604D !important;
}

.product-item
.product-thumb
.product-action
> .jovio-card-wishlist:hover {
    color: #F9604D !important;
}

.product-item
.product-thumb
.product-action
> .jovio-card-wishlist.is-added {
    color: #fff !important;
    background: #F9604D !important;
    border-color: #F9604D !important;
}


/* ============================================================
   JOVIO — FORCE WISHLIST HEART ICON
   ICON ONLY — LOGIC UNCHANGED
   ============================================================ */

.product-item
.product-thumb
.product-action
> .jovio-card-wishlist
i {
    display: none !important;
}

.product-item
.product-thumb
.product-action
> .jovio-card-wishlist::before {
    content: "\f004" !important;

    display: block !important;

    font-family: "FontAwesome" !important;
    font-style: normal !important;
    font-weight: normal !important;

    font-size: 19px !important;
    line-height: 1 !important;

    color: #F9604D !important;
}

.product-item
.product-thumb
.product-action
> .jovio-card-wishlist::after {
    display: none !important;
    content: none !important;
}

@media (max-width: 767px) {

    .product-item
    .product-thumb
    .product-action
    > .jovio-card-wishlist::before {
        font-size: 18px !important;
    }

}


/* JOVIO_FEATURED_MOBILE_CARD_V2_START */

@media (max-width: 767px) {

    /* slider spacing */
    .product-tab1-slider .slick-list {
        margin: 0 -5px !important;
        padding: 2px 0 8px !important;
    }

    .product-tab1-slider .slick-slide {
        padding: 0 5px !important;
        height: auto !important;
    }

    .product-tab1-slider .slick-slide > div,
    .product-tab1-slider .slide-item {
        height: 100% !important;
    }


    /* CARD */
    .product-tab1-slider .product-item {
        position: relative !important;

        width: 100% !important;
        height: 100% !important;
        min-height: 360px !important;

        margin: 0 !important;

        display: flex !important;
        flex-direction: column !important;

        overflow: hidden !important;

        border: 1px solid #e7e7ef !important;
        border-radius: 14px !important;

        background: #fff !important;

        box-shadow: none !important;
    }


    /* IMAGE AREA */
    .product-tab1-slider .product-item .product-thumb {
        position: relative !important;

        width: 100% !important;
        height: 178px !important;
        min-height: 178px !important;

        aspect-ratio: auto !important;

        margin: 0 !important;
        padding: 10px 10px 4px !important;

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

        background: #fff !important;
    }

    .product-tab1-slider .product-item .product-thumb > a {
        width: 100% !important;
        height: 100% !important;

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

    .product-tab1-slider .product-item .product-thumb img {
        width: 100% !important;
        height: 100% !important;

        max-width: 100% !important;
        max-height: 100% !important;

        object-fit: contain !important;
    }


    /* WISHLIST */
    .product-tab1-slider
    .product-item
    .product-thumb
    .product-action
    > .jovio-card-wishlist {
        top: 9px !important;
        left: 9px !important;
        right: auto !important;

        width: 38px !important;
        height: 38px !important;

        border: 1px solid #ededf2 !important;
        border-radius: 50% !important;

        background: #fff !important;

        color: #F9604D !important;

        box-shadow:
            0 4px 12px rgba(30,30,60,.09) !important;
    }

    .product-tab1-slider
    .product-item
    .jovio-card-wishlist::before {
        color: #F9604D !important;
        font-size: 18px !important;
    }


    /* INFO */
    .product-tab1-slider .product-item .product-info {
        flex: 1 1 auto !important;

        min-height: 128px !important;

        padding: 8px 12px 10px !important;

        display: flex !important;
        flex-direction: column !important;

        text-align: right !important;
    }


    /* TITLE — EXACTLY TWO LINES */
    .product-tab1-slider
    .product-item
    .product-info
    .title {
        min-height: 46px !important;

        margin: 0 0 8px !important;

        display: block !important;

        font-size: 14px !important;
        font-weight: 700 !important;

        line-height: 1.65 !important;

        text-align: right !important;

        overflow: hidden !important;
    }

    .product-tab1-slider
    .product-item
    .product-info
    .title a {
        display: -webkit-box !important;

        overflow: hidden !important;

        color: #24232b !important;

        font-size: 14px !important;
        font-weight: 700 !important;

        line-height: 1.65 !important;

        text-align: right !important;

        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }


    /* PRICE */
    .product-tab1-slider
    .product-item
    .product-info
    .prices {
        min-height: 28px !important;

        margin-top: auto !important;
        margin-bottom: 8px !important;

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

        gap: 6px !important;
    }

    .product-tab1-slider
    .product-item
    .product-info
    .prices
    .price {
        color: #24232b !important;

        font-size: 14px !important;
        font-weight: 800 !important;

        line-height: 1.4 !important;
    }

    .product-tab1-slider
    .product-item
    .product-info
    .prices
    .text-danger {
        font-size: 11px !important;
    }


    /* ADD TO CART — FIXED BOTTOM */
    .product-tab1-slider .product-item .btn-theme,
    .product-tab1-slider .product-item .add-to-cart,
    .product-tab1-slider .product-item [class*="add-to-cart"],
    .product-tab1-slider .product-item button[type="submit"] {
        width: calc(100% - 18px) !important;
        min-height: 40px !important;

        margin: 0 9px 9px !important;
        padding: 7px 8px !important;

        border: 0 !important;
        border-radius: 8px !important;

        background: #7773bc !important;
        color: #fff !important;

        font-size: 12px !important;
        font-weight: 700 !important;

        line-height: 1.2 !important;

        box-shadow: none !important;
    }


    /* SOLD OUT */
    .product-tab1-slider
    .product-item
    .out-stock-badge {
        top: 9px !important;
        right: 9px !important;

        padding: 6px 8px !important;

        border-radius: 6px !important;

        font-size: 10px !important;
        font-weight: 700 !important;
    }

}


/* EXTRA SMALL PHONES */

@media (max-width: 390px) {

    .product-tab1-slider .product-item {
        min-height: 340px !important;
    }

    .product-tab1-slider .product-item .product-thumb {
        height: 160px !important;
        min-height: 160px !important;
    }

    .product-tab1-slider
    .product-item
    .product-info
    .title,
    .product-tab1-slider
    .product-item
    .product-info
    .title a {
        font-size: 13px !important;
    }

}

/* JOVIO_FEATURED_MOBILE_CARD_V2_END */


/* ============================================================
   JOVIO — FEATURED PRODUCTS COMPACT MOBILE CARD
   MATCH REFERENCE
   ============================================================ */

@media (max-width: 767px) {

    .product-tab1-slider .product-item {
        height: 282px !important;
        min-height: 282px !important;
        max-height: 282px !important;

        border-radius: 13px !important;

        display: flex !important;
        flex-direction: column !important;

        overflow: hidden !important;
    }


    /* IMAGE */

    .product-tab1-slider
    .product-item
    .product-thumb {
        height: 132px !important;
        min-height: 132px !important;
        max-height: 132px !important;

        padding: 10px 10px 2px !important;

        flex: 0 0 132px !important;
    }


    .product-tab1-slider
    .product-item
    .product-thumb img {
        width: 100% !important;
        height: 100% !important;

        max-width: 100% !important;
        max-height: 100% !important;

        object-fit: contain !important;
    }


    /* INFO */

    .product-tab1-slider
    .product-item
    .product-info {
        height: 94px !important;
        min-height: 94px !important;
        max-height: 94px !important;

        padding: 5px 10px 3px !important;

        flex: 0 0 94px !important;

        display: flex !important;
        flex-direction: column !important;
    }


    /* TITLE */

    .product-tab1-slider
    .product-item
    .product-info
    .title {
        min-height: 42px !important;
        max-height: 42px !important;

        margin: 0 !important;

        font-size: 13px !important;
        line-height: 1.6 !important;
        font-weight: 700 !important;
    }


    .product-tab1-slider
    .product-item
    .product-info
    .title a {
        font-size: 13px !important;
        line-height: 1.6 !important;
        font-weight: 700 !important;

        -webkit-line-clamp: 2 !important;
    }


    /* PRICE */

    .product-tab1-slider
    .product-item
    .product-info
    .prices {
        min-height: 25px !important;

        margin:
            auto 0 0 !important;

        padding: 0 !important;

        display: flex !important;
        align-items: center !important;
    }


    .product-tab1-slider
    .product-item
    .product-info
    .prices
    .price {
        font-size: 13px !important;
        font-weight: 800 !important;
    }


    /* ADD TO CART */

    .product-tab1-slider
    .product-item
    .btn-theme,
    .product-tab1-slider
    .product-item
    .add-to-cart,
    .product-tab1-slider
    .product-item
    [class*="add-to-cart"],
    .product-tab1-slider
    .product-item
    button[type="submit"] {
        width: calc(100% - 16px) !important;

        height: 38px !important;
        min-height: 38px !important;
        max-height: 38px !important;

        margin:
            5px 8px 8px !important;

        padding: 5px 6px !important;

        border-radius: 7px !important;

        font-size: 11px !important;
        font-weight: 700 !important;

        flex: 0 0 38px !important;
    }


    /* HEART */

    .product-tab1-slider
    .product-item
    .product-thumb
    .product-action
    > .jovio-card-wishlist {
        top: 8px !important;
        left: 8px !important;

        width: 35px !important;
        height: 35px !important;
    }


    .product-tab1-slider
    .product-item
    .jovio-card-wishlist::before {
        font-size: 17px !important;
    }

}


/* SMALL PHONES */

@media (max-width: 390px) {

    .product-tab1-slider .product-item {
        height: 272px !important;
        min-height: 272px !important;
        max-height: 272px !important;
    }

    .product-tab1-slider
    .product-item
    .product-thumb {
        height: 124px !important;
        min-height: 124px !important;
        max-height: 124px !important;

        flex-basis: 124px !important;
    }

}

/* JOVIO — MOBILE PRODUCT CARDS SIDE SPACE */

@media (max-width: 767px) {

    .product-tab1-slider {
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .product-tab1-slider .slick-list {
        margin-left: 12px !important;
        margin-right: 12px !important;
        padding: 2px 0 8px !important;
    }

    .product-tab1-slider .slick-slide {
        padding-left: 5px !important;
        padding-right: 5px !important;
    }

}

@media (max-width: 390px) {

    .product-tab1-slider .slick-list {
        margin-left: 9px !important;
        margin-right: 9px !important;
    }

}