/* IMBMS product cards — Myntra-style listing + home grids */



/* ── Product card ── */

.imbms-product-card {
    background: #fff;
    border: 1px solid #f0f0f5;
    border-radius: 4px;
    display: flex;
    flex-direction: column;
    height: 100%;
    margin: 0;
    overflow: hidden;
    padding: 0;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.imbms-product-card-text-link {
    color: inherit;
    display: block;
    text-decoration: none !important;
}

.imbms-product-card:hover {
    border-color: #eaeaec;
    box-shadow: 0 4px 16px rgba(40, 44, 63, 0.1);
}

.imbms-product-card-media {
    align-items: center;
    aspect-ratio: 1 / 1;
    background: #f5f5f6;
    box-sizing: border-box;
    display: flex;
    flex-shrink: 0;
    justify-content: center;
    overflow: hidden;
    padding: 0;
    position: relative;
    width: 100%;
}

.imbms-card-carousel {
    align-items: center;
    display: flex;
    height: 100%;
    justify-content: center;
    position: relative;
    width: 100%;
}

.imbms-card-slides {
    align-items: center;
    display: flex;
    height: 100%;
    justify-content: center;
    position: relative;
    width: 100%;
}

.imbms-card-slide {
    align-items: center;
    box-sizing: border-box;
    display: none;
    height: 100%;
    justify-content: center;
    padding: 10px;
    width: 100%;
}

.imbms-card-slide.is-active {
    display: flex;
}

.imbms-card-slide img {
    display: block;
    flex-shrink: 0;
    height: auto !important;
    max-height: 100% !important;
    max-width: 100% !important;
    object-fit: contain !important;
    object-position: center center;
    width: auto !important;
}

.imbms-card-image-link {
    align-items: center;
    display: flex;
    height: 100%;
    justify-content: center;
    text-decoration: none !important;
    width: 100%;
}

.imbms-card-nav {
    align-items: center;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid #eaeaec;
    border-radius: 50%;
    box-shadow: 0 2px 8px rgba(40, 44, 63, 0.12);
    color: #282c3f;
    cursor: pointer;
    display: flex;
    font-size: 18px;
    height: 28px;
    justify-content: center;
    line-height: 1;
    opacity: 0;
    padding: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    transition: opacity 0.2s ease, border-color 0.2s ease, color 0.2s ease;
    width: 28px;
    z-index: 3;
}

.imbms-card-nav[hidden] {
    display: none !important;
}

.imbms-card-nav.imbms-card-prev {
    left: 6px;
}

.imbms-card-nav.imbms-card-next {
    right: 6px;
}

.imbms-product-card.has-carousel:hover .imbms-card-nav,
.imbms-product-card-media:focus-within .imbms-card-nav {
    opacity: 1;
}

.imbms-card-nav:hover {
    border-color: #ff3f6c;
    color: #ff3f6c;
}

.imbms-card-dots {
    bottom: 8px;
    display: flex;
    gap: 5px;
    justify-content: center;
    left: 0;
    position: absolute;
    right: 0;
    z-index: 3;
}

.imbms-card-dot {
    background: #d4d5d9;
    border: 0;
    border-radius: 50%;
    cursor: pointer;
    height: 5px;
    padding: 0;
    width: 5px;
}

.imbms-card-dot.is-active {
    background: #ff3f6c;
    border-radius: 3px;
    width: 14px;
}

.imbms-card-view-btn {
    background: #ff3f6c;
    border: 1px solid #ff3f6c;
    border-radius: 4px;
    box-sizing: border-box;
    color: #fff;
    display: block;
    font-family: 'Assistant', sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.5px;
    line-height: 1.2;
    margin: 8px 0 6px;
    max-height: 40px;
    opacity: 1;
    overflow: hidden;
    padding: 9px 12px;
    pointer-events: auto;
    text-align: center;
    text-decoration: none !important;
    text-transform: uppercase;
    transition: opacity 0.2s ease, max-height 0.25s ease, margin 0.2s ease, padding 0.2s ease, background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
    width: 100%;
}

.imbms-card-view-btn:hover {
    background: #e5385f;
    border-color: #e5385f;
    box-shadow: 0 2px 8px rgba(255, 63, 108, 0.35);
    color: #fff;
}

.imbms-card-actions {
    align-items: stretch;
    display: flex;
    gap: 8px;
    margin: 8px 0 6px;
    width: 100%;
}

.imbms-btn-text-mobile {
    display: none;
}

.imbms-product-card.is-listing .imbms-card-actions .imbms-card-view-btn,
.imbms-product-card.is-listing .imbms-card-actions .imbms-card-bag-btn,
.imbms-product-card.is-listing .imbms-card-actions .imbms-card-stock-msg {
    flex: 1 1 0;
    margin: 0;
    max-height: none;
    min-width: 0;
    width: auto;
}

.imbms-product-card.is-listing .imbms-card-actions .imbms-card-view-btn,
.imbms-product-card.is-listing .imbms-card-actions .imbms-card-bag-btn {
    padding: 9px 8px;
    pointer-events: auto;
}

.imbms-product-card.is-listing .imbms-card-view-btn {
    background: #fff;
    border: 1px solid #ff3f6c;
    color: #ff3f6c;
}

.imbms-product-card.is-listing .imbms-card-view-btn:hover {
    background: #fff5f7;
    box-shadow: none;
    color: #ff3f6c;
}

.imbms-card-bag-btn {
    background: #ff3f6c;
    border: 1px solid #ff3f6c;
    border-radius: 4px;
    box-sizing: border-box;
    color: #fff;
    cursor: pointer;
    display: block;
    font-family: 'Assistant', sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.3px;
    line-height: 1.2;
    text-align: center;
    text-decoration: none !important;
    text-transform: uppercase;
    transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
    white-space: nowrap;
}

.imbms-card-bag-btn:hover {
    background: #e5385f;
    border-color: #e5385f;
    box-shadow: 0 2px 8px rgba(255, 63, 108, 0.35);
    color: #fff;
}

.imbms-card-bag-btn.is-loading {
    opacity: 0.7;
}

.imbms-card-stock-msg {
    background: #f5f5f6;
    border: 1px solid #eaeaec;
    border-radius: 4px;
    box-sizing: border-box;
    color: #696b79;
    display: block;
    font-family: 'Assistant', sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.4px;
    margin: 8px 0 6px;
    padding: 9px 8px;
    text-align: center;
    text-transform: uppercase;
    width: 100%;
}

.imbms-card-stock-msg.is-oos {
    background: #fff5f5;
    border-color: #ffcdd2;
    color: #e53935;
}

.imbms-product-card.is-out-of-stock .imbms-product-card-media,
.imbms-product-card.is-coming-soon .imbms-product-card-media {
    opacity: 0.85;
}

.imbms-product-card.is-listing .imbms-card-actions {
    transition: opacity 0.2s ease, max-height 0.25s ease, margin 0.2s ease;
}

@media (hover: hover) and (pointer: fine) {
    .imbms-card-view-btn {
        border-width: 0;
        margin: 0;
        max-height: 0;
        opacity: 0;
        padding: 0 12px;
        pointer-events: none;
    }

    .imbms-product-card:not(.is-listing):hover .imbms-card-view-btn,
    .imbms-product-card:not(.is-listing):focus-within .imbms-card-view-btn {
        border-width: 1px;
        margin: 8px 0 6px;
        max-height: 40px;
        opacity: 1;
        padding: 9px 12px;
        pointer-events: auto;
        width: 100%;
    }

    .imbms-product-card.is-listing .imbms-card-actions {
        margin: 0;
        max-height: 0;
        opacity: 0;
        overflow: hidden;
        pointer-events: none;
    }

    .imbms-product-card.is-listing:hover .imbms-card-actions,
    .imbms-product-card.is-listing:focus-within .imbms-card-actions {
        margin: 8px 0 6px;
        max-height: 48px;
        opacity: 1;
        overflow: visible;
        pointer-events: auto;
    }

    .imbms-product-card.is-listing .imbms-card-actions .imbms-card-view-btn,
    .imbms-product-card.is-listing .imbms-card-actions .imbms-card-bag-btn {
        border-width: 1px;
        max-height: 40px;
        opacity: 1;
    }
}

/* Touch devices — always show listing actions (same as desktop hover result) */
@media (pointer: coarse) {
    .imbms-product-card.is-listing .imbms-card-actions {
        margin: 8px 0 6px;
        max-height: none;
        opacity: 1;
        overflow: visible;
        pointer-events: auto;
    }

    .imbms-product-card.is-listing .imbms-card-actions .imbms-card-view-btn,
    .imbms-product-card.is-listing .imbms-card-actions .imbms-card-bag-btn {
        border-width: 1px;
        max-height: 40px;
        opacity: 1;
    }
}

.imbms-product-card-info {

    display: flex;

    flex: 1;

    flex-direction: column;

    gap: 3px;

    padding: 8px 10px 10px;

    text-align: left;

}



.imbms-product-card-brand {

    color: #282c3f;

    font-family: 'Assistant', sans-serif;

    font-size: 14px;

    font-weight: 700;

    line-height: 1.25;

    overflow: hidden;

    text-overflow: ellipsis;

    text-transform: capitalize;

    white-space: nowrap;

}



.imbms-product-card-title {

    -webkit-box-orient: vertical;

    -webkit-line-clamp: 2;

    color: #535766;

    display: -webkit-box;

    font-family: 'Assistant', sans-serif;

    font-size: 13px;

    font-weight: 400;

    line-height: 1.35;

    margin: 0;

    min-height: 0;

    overflow: hidden;

}



.imbms-product-card-price {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 4px 8px;
    justify-content: center;
    margin-top: 4px;
    text-align: center;
    width: 100%;
}

.imbms-price-now {
    color: #282c3f;
    font-family: 'Assistant', sans-serif;
    font-size: 15px;
    font-weight: 800;
    line-height: 1.2;
}

.imbms-price-was {
    color: #e53935;
    font-family: 'Assistant', sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: line-through;
}

.imbms-price-off {
    animation: imbms-price-off-blink 1.2s ease-in-out infinite;
    color: #03a685;
    font-family: 'Assistant', sans-serif;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.2;
    white-space: nowrap;
}

@keyframes imbms-price-off-blink {
    0%,
    100% {
        opacity: 1;
    }

    50% {
        opacity: 0.35;
    }
}



.imbms-product-card-ship {

    align-items: center;

    color: #03a685;

    display: inline-flex;

    font-size: 11px;

    font-weight: 600;

    gap: 4px;

    margin-top: 2px;

}



.imbms-product-card-ship i {

    font-size: 11px;

}



/* ── Shop / category listing grid ── */

.imbms-shop-page {

    background: var(--imbms-page-bg, #f5f5f6) !important;

    padding-bottom: 48px !important;

    padding-top: 24px !important;

}



.imbms-shop-header {

    background: #fff;

    border: 1px solid #eaeaec;

    border-radius: 4px;

    margin-bottom: 20px;

    padding: 20px 24px;

}



.imbms-shop-header h1 {

    color: #282c3f !important;

    font-family: 'Assistant', sans-serif !important;

    font-size: 22px !important;

    font-weight: 800 !important;

    letter-spacing: 0.5px;

    margin: 0 0 6px !important;

    text-align: left !important;

    text-transform: uppercase;

}



.imbms-shop-header p {

    color: #696b79;

    font-size: 14px;

    margin: 0;

}



.shop-page-area .container {

    max-width: 1280px;

}



/* ── Product grid (listing + home — identical layout) ── */

.imbms-home-product-grid,
.imbms-product-grid {

    display: grid;

    gap: 20px 16px;

    grid-template-columns: repeat(4, minmax(0, 1fr));

    width: 100%;

}



.imbms-home-product-grid {

    background: transparent;

    border: none;

    border-radius: 0;

    box-sizing: border-box;

    overflow: visible;

    padding: 0;

}



.imbms-product-grid .imbms-product-card,
.imbms-home-product-grid .imbms-product-card {

    min-width: 0;

    width: 100%;

}



.featured-product-active.owl-carousel .imbms-product-card-media {

    aspect-ratio: 1 / 1;

}



/* Block legacy global img { width:100% } rules from stretching cards */
.imbms-product-card .imbms-card-slide img,
.imbms-product-card .imbms-product-card-media img,
.imbms-product-grid .imbms-product-card-media img,
.imbms-home-product-grid .imbms-product-card-media img,
.featured-product-active .imbms-product-card-media img {
    height: auto !important;
    max-height: 100% !important;
    max-width: 100% !important;
    object-fit: contain !important;
    width: auto !important;
}



/* ── Home product rails ── */

.product-area {

    background: #fff !important;

    border-bottom: 1px solid #eaeaec;

    margin-bottom: 0 !important;

    overflow: hidden;

    padding: 20px 0 24px !important;

}



.product-area .container {

    margin-left: auto;

    margin-right: auto;

    max-width: 1280px !important;

    padding-left: 24px;

    padding-right: 24px;

    position: relative;

    width: 100%;

}



.product-top-bar {

    align-items: center;

    display: flex;

    justify-content: space-between;

    margin-bottom: 14px !important;

    min-height: 36px;

    padding-right: 88px;

    position: relative;

}



.product-top-bar.section-border {

    border: none;

    margin-right: 0 !important;

}



.product-top-bar.section-border::before {

    display: none !important;

}



.product-area .section-title-wrap {

    display: block !important;

    float: none !important;

    text-align: left !important;

    width: 100%;

}



.product-area p.section-title,

.product-area p.section-title.section-bg-white {

    background: transparent !important;

    color: #282c3f !important;

    display: block;

    font-family: 'Assistant', sans-serif !important;

    font-size: 20px !important;

    font-weight: 800 !important;

    letter-spacing: 0.6px;

    margin: 0 !important;

    padding: 0 !important;

    text-align: left !important;

    text-transform: uppercase;

}



.featured-product-active.owl-carousel .owl-stage-outer {

    margin: 0 !important;

    overflow: hidden !important;

    padding: 0 !important;

    width: 100%;

}



.featured-product-active.owl-carousel .owl-stage {

    display: flex;

}



.featured-product-active.owl-carousel .owl-item {

    align-items: stretch;

    box-sizing: border-box;

    display: flex;

    float: none;

    padding: 0 6px;

}



.featured-product-active.owl-carousel .owl-item > .imbms-product-card {

    width: 100%;

}



.featured-product-active.owl-carousel .owl-item:first-child {

    padding-left: 0;

}



.product-area .product-nav.owl-carousel .owl-nav {

    display: flex;

    gap: 8px;

    margin: 0;

    position: absolute;

    right: 0;

    top: -46px;

    z-index: 3;

}



.product-nav .owl-nav div {

    background: #fff !important;

    border: 1px solid #d4d5d9 !important;

    border-radius: 50% !important;

    box-shadow: none !important;

    color: #282c3f !important;

    font-size: 16px !important;

    height: 32px !important;

    line-height: 30px !important;

    margin: 0 !important;

    width: 32px !important;

}



.product-nav .owl-nav div:hover {

    background: #ff3f6c !important;

    border-color: #ff3f6c !important;

    color: #fff !important;

}



.imbms-cat-shortcuts {

    margin-bottom: 0 !important;

    padding-bottom: 8px !important;

}



/* ── Legacy card overrides (prevent style.css bleed) ── */

.imbms-product-grid .product-wrapper,

.imbms-home-product-grid .product-wrapper {

    padding: 0 !important;

}



.imbms-shop-page .product-content,

.imbms-product-grid .product-content {

    background: transparent !important;

    box-shadow: none !important;

    min-height: 0 !important;

    padding: 0 !important;

}



/* ── Responsive ── */

@media (min-width: 1200px) {

    .imbms-product-grid {

        grid-template-columns: repeat(4, minmax(0, 1fr));

    }

}



@media (min-width: 992px) and (max-width: 1199px) {

    .imbms-product-grid {

        grid-template-columns: repeat(4, minmax(0, 1fr));

    }



    .featured-product-active.owl-carousel .owl-item {

        padding: 0 8px;

    }

}



@media (max-width: 991px) {

    .imbms-product-grid,

    .imbms-home-product-grid {

        grid-template-columns: repeat(3, minmax(0, 1fr));

    }



    .imbms-home-product-grid {

        padding: 0;

    }



    .product-area .container,

    .imbms-shop-page .container {

        padding-left: 16px;

        padding-right: 16px;

    }



    /* Phones/tablets: always show listing buttons (same as desktop hover) */
    .imbms-product-card.is-listing .imbms-card-actions {

        margin: 8px 0 6px !important;

        max-height: none !important;

        opacity: 1 !important;

        overflow: visible !important;

        pointer-events: auto !important;

    }



    .imbms-product-card.is-listing .imbms-card-actions .imbms-card-view-btn,

    .imbms-product-card.is-listing .imbms-card-actions .imbms-card-bag-btn {

        border-width: 1px !important;

        opacity: 1 !important;

        pointer-events: auto !important;

    }



    .imbms-product-card.has-carousel .imbms-card-nav {

        opacity: 1;

    }



    .product-area .product-nav.owl-carousel .owl-nav {

        right: 0;

        top: -40px;

    }

}



@media (max-width: 767px) {

    .imbms-product-grid,

    .imbms-home-product-grid {

        gap: 20px 16px;

        grid-template-columns: repeat(2, minmax(0, 1fr));

    }



    .imbms-home-product-grid {

        padding: 0;

    }



    .product-area .container,

    .imbms-shop-page .container {

        padding-left: 16px !important;

        padding-right: 16px !important;

    }



    /* Home + listing: identical mobile cards */
    .imbms-product-grid .imbms-product-card,

    .imbms-home-product-grid .imbms-product-card {

        min-width: 0;

        width: 100%;

    }



    .imbms-product-grid .imbms-product-card-media,

    .imbms-home-product-grid .imbms-product-card-media,

    .imbms-shop-page .imbms-product-card-media {

        aspect-ratio: 1 / 1;

        max-height: none;

    }



    .imbms-product-card.is-listing .imbms-card-actions {

        gap: 4px;

        margin: 4px 0 2px !important;

        max-height: none !important;

        opacity: 1 !important;

        overflow: visible !important;

        pointer-events: auto !important;

    }



    .imbms-product-card.is-listing .imbms-card-actions .imbms-card-view-btn,

    .imbms-product-card.is-listing .imbms-card-actions .imbms-card-bag-btn {

        border-radius: 2px;

        border-width: 1px !important;

        font-size: 9px;

        font-weight: 600;

        letter-spacing: 0;

        line-height: 1;

        max-height: 26px !important;

        min-height: 0;

        opacity: 1 !important;

        padding: 5px 2px !important;

        pointer-events: auto !important;

        text-transform: uppercase;

        white-space: nowrap;

    }



    .imbms-product-card.is-listing .imbms-card-view-btn {

        background: #fff !important;

        color: #ff3f6c !important;

    }



    .imbms-product-card.is-listing .imbms-card-actions .imbms-card-bag-btn {

        background: #ff3f6c !important;

        color: #fff !important;

    }



    .imbms-btn-text-desktop {

        display: none;

    }



    .imbms-btn-text-mobile {

        display: inline;

    }



    .imbms-product-grid .imbms-product-card-info,

    .imbms-home-product-grid .imbms-product-card-info {

        gap: 2px;

        padding: 6px 8px 8px;

    }



    .imbms-product-card.has-carousel .imbms-card-nav {

        opacity: 1;

    }



    .imbms-card-nav {

        height: 24px;

        width: 24px;

        font-size: 16px;

    }



    .imbms-shop-header {

        padding: 16px;

    }



    .imbms-shop-header h1 {

        font-size: 18px !important;

    }



    .product-area {

        padding: 16px 0 20px !important;

    }



    .product-top-bar {

        padding-right: 72px;

    }



    .product-area p.section-title,

    .product-area p.section-title.section-bg-white {

        font-size: 15px !important;

        letter-spacing: 0.4px;

    }



    .product-area .product-nav.owl-carousel .owl-nav {

        right: 0;

        top: -38px;

    }



    .product-nav .owl-nav div {

        font-size: 14px !important;

        height: 28px !important;

        line-height: 26px !important;

        width: 28px !important;

    }

}



