/* ==========================================================
   Kasi Mattress
   Product Page
   File: assets/css/pages/product.css
   Version: 2.0.0
   ========================================================== */


/* ==========================================================
   PAGE
========================================================== */

.km-product-page{

    background:var(--white);

}


/* ==========================================================
   BREADCRUMB
========================================================== */

.km-product-breadcrumb{

    padding:24px 0;

    background:#FAFBFD;

    border-bottom:1px solid var(--border);

}

.km-product-breadcrumb nav{

    display:flex;

    flex-wrap:wrap;

    align-items:center;

    gap:10px;

    font-size:.95rem;

}

.km-product-breadcrumb a{

    color:var(--primary);

    text-decoration:none;

    transition:.25s;

}

.km-product-breadcrumb a:hover{

    color:var(--accent);

}

.km-product-breadcrumb span{

    color:var(--text-light);

}


/* ==========================================================
   PRODUCT LAYOUT
========================================================== */

.km-product-header{

    padding:70px 0;

}

.km-product-layout{

    display:grid;

    grid-template-columns:1.1fr .9fr;

    gap:60px;

    align-items:start;

}


/* ==========================================================
   PRODUCT RATING
========================================================== */

.km-product-information .km-rating-stars{

    color:var(--accent);

}

.km-product-information .km-rating-stars i{

    color:inherit;

}


/* ==========================================================
   CONTENT SECTIONS
========================================================== */

.km-product-section{

    padding:80px 0;

    border-top:1px solid var(--border);

}


/* ==========================================================
   STICKY MOBILE CTA
========================================================== */

.km-mobile-product-cta{

    display:none;

}


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

@media (max-width:992px){

    .km-product-layout{

        grid-template-columns:1fr;

        gap:45px;

    }

}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width:768px){

    .km-product-header{

        padding:50px 0;

    }

    .km-mobile-product-cta{

        display:flex;

        position:fixed;

        left:0;

        right:0;

        bottom:0;

        z-index:1000;

        gap:12px;

        padding:16px;

        background:var(--white);

        border-top:1px solid var(--border);

        box-shadow:0 -8px 20px rgba(0,0,0,.08);

    }

    .km-mobile-product-cta .km-btn{

        flex:1;

        justify-content:center;

    }

    body{

        padding-bottom:90px;

    }

}


/* ==========================================================
   SMALL MOBILE
========================================================== */

@media (max-width:576px){

    .km-product-breadcrumb{

        font-size:.85rem;

    }

}