/* ==========================================
   Product Page
========================================== */

.product-page{

    padding:50px 0 80px;

    background:#fff;

}


/* ==========================================
   Breadcrumb
========================================== */

.product-breadcrumb{

    display:flex;

    align-items:center;

    gap:12px;

    margin-bottom:35px;

    font-size:14px;

}

.product-breadcrumb a{

    color:#2b67f6;

    text-decoration:none;

    font-weight:600;

}

.product-breadcrumb i{

    color:#bfc8d9;

    font-size:12px;

}

.product-breadcrumb span{

    color:#667085;

}


/* ==========================================
   Image Card
========================================== */

.product-image-card{

    background:#f7faff;

    border-radius:24px;

    padding:35px;

    text-align:center;

    border:1px solid #edf2f8;

    box-shadow:

        0 18px 45px rgba(27,63,117,.08);

}

.product-image-card img{

    width:100%;

    transition:.35s;

}

.product-image-card:hover img{

    transform:scale(1.03);

}


/* ==========================================
   Badge
========================================== */

.product-badge{

    display:inline-block;

    padding:8px 18px;

    background:#eaf2ff;

    color:#2d67f5;

    border-radius:40px;

    font-size:13px;

    font-weight:700;

    margin-bottom:18px;

}


/* ==========================================
   Title
========================================== */

.product-title{

    font-size:48px;

    font-weight:800;

    color:#08142f;

    margin-bottom:10px;

}

.product-author{

    color:#667085;

    margin-bottom:30px;

}

.product-author strong{

    color:#2563eb;

}


/* ==========================================
   Summary
========================================== */

.product-summary{

    color:#58667e;

    font-size:18px;

    line-height:1.8;

    margin-bottom:35px;

}


/* ==========================================
   Meta
========================================== */

.product-meta{

    display:flex;

    gap:50px;

    border-top:1px solid #edf2f7;

    padding-top:25px;

}

.product-meta strong{

    display:block;

    font-size:14px;

    color:#98a3b8;

}

.product-meta span{

    font-weight:700;

    color:#0f172a;

}


/* ==========================================
   Purchase Card
========================================== */

.purchase-card{

    position:sticky;

    top:110px;

    background:#fff;

    border-radius:22px;

    padding:30px;

    border:1px solid #edf2f7;

    box-shadow:

        0 18px 40px rgba(15,23,42,.08);

}

.old-price{

    color:#94a3b8;

    text-decoration:line-through;

    font-size:18px;

}

.current-price{

    font-size:48px;

    font-weight:800;

    color:#2563eb;

    margin-bottom:25px;

}

.purchase-card .btn{

    border-radius:14px;

    font-weight:700;

    padding:14px;

}


/* ==========================================
   Product Info
========================================== */

.product-info{

    list-style:none;

    padding:0;

    margin:0;

}

.product-info li{

    display:flex;

    justify-content:space-between;

    margin-bottom:15px;

}

.product-info span{

    color:#7a859d;

}

.product-info strong{

    color:#0f172a;

}


/* ==========================================
   Tabs
========================================== */

.product-tabs{

    margin-top:60px;

}

.product-tabs .nav-tabs{

    border:none;

    gap:20px;

}

.product-tabs .nav-link{

    border:none;

    color:#7a859d;

    font-weight:700;

    padding:0 0 14px;

}

.product-tabs .nav-link.active{

    color:#2563eb;

    border-bottom:3px solid #2563eb;

    background:none;

}

.tab-content{

    margin-top:30px;

    background:#fff;

    border:1px solid #edf2f7;

    border-radius:20px;

    padding:35px;

}


/* ==========================================
   Responsive
========================================== */

@media(max-width:991px){

    .product-title{

        font-size:34px;

    }

    .purchase-card{

        position:relative;

        top:0;

        margin-top:40px;

    }

    .product-meta{

        gap:20px;

        flex-wrap:wrap;

    }

}

/* ==========================================
   Product Gallery
========================================== */

.product-gallery{

    position:sticky;

    top:110px;
    
    text-align: center;

}

.product-gallery-card{

    position:relative;

    overflow:hidden;

    border-radius:26px;

    padding:45px;

    text-align:center;

    border:1px solid #edf2f7;

    background:
        linear-gradient(
            180deg,
            #eef5ff 0%,
            #ffffff 100%
        );

    box-shadow:
        0 20px 60px rgba(30,64,175,.08);

}

/* subtle wave background */

.product-gallery-card::before{

    content:"";

    position:absolute;

    inset:0;

    background:url("../images/marketplace/bg-wave.png")
               center/cover no-repeat;

    opacity:.35;

    pointer-events:none;

}

/* dots */

.product-gallery-card::after{

    content:"";

    position:absolute;

    top:18px;

    left:18px;

    width:120px;

    height:120px;

    background:url("../images/marketplace/dots.png")
               no-repeat;

    background-size:contain;

    opacity:.35;

}

.product-image{

    position:relative;

    z-index:2;

    max-width:100%;

    transition:.35s;

}

.product-gallery-card:hover .product-image{

    transform:translateY(-6px) scale(1.03);

}

/* Preview button */

.btn-live-preview{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    margin-top:28px;

    padding:14px 26px;

    border-radius:14px;

    font-weight:700;

    border:2px solid #2563eb;

    color:#2563eb;

    background:#fff;

    transition:.25s;

    text-decoration:none;

}

.btn-live-preview:hover{

    background:#2563eb;

    color:#fff;

    transform:translateY(-2px);

    box-shadow:

        0 10px 24px rgba(37,99,235,.25);

}

.product-sidebar{

    position:sticky;

    top:110px;

}

.sidebar-card{

    background:#fff;

    border:1px solid #edf2f7;

    border-radius:22px;

    padding:28px;

    margin-bottom:22px;

    box-shadow:0 15px 45px rgba(0,0,0,.05);

}

.sidebar-header{

    display:flex;

    justify-content:space-between;

    margin-bottom:22px;

}

.sidebar-header h5{

    font-weight:700;

    margin:0;

}

.sidebar-header a{

    text-decoration:none;

    color:#2b67f6;

}

.license-option{

    display:flex;

    justify-content:space-between;

    align-items:center;

    border:1px solid #e8eef8;

    border-radius:14px;

    padding:14px 18px;

    margin-bottom:12px;

    cursor:pointer;

}

.license-option.active{

    background:#f7fbff;

    border-color:#2b67f6;

}

.license-option strong{

    color:#18a34a;

    font-size:22px;

}

.license-features{

    list-style:none;

    padding:0;

    margin:25px 0;

}

.license-features li{

    margin-bottom:14px;

    color:#4b5563;

}

.license-features i{

    color:#17b45f;

    margin-right:10px;

}

.purchase-note{

    text-align:center;

    margin-top:18px;

    font-size:13px;

}

.purchase-note a{

    text-decoration:none;

    font-weight:600;

}

.seller-card{

    display:flex;

    align-items:center;

    gap:16px;

}

.seller-card img{

    width:54px;

    height:54px;

    border-radius:50%;

}

.plugin-info{

    width:100%;

}

.plugin-info td{

    padding:9px 0;

}

.plugin-info td:first-child{

    color:#6b7280;

}

.plugin-info td:last-child{

    text-align:right;

    font-weight:600;

}

.review-loader{

    display:flex;

    flex-direction:column;

    gap:16px;

}

.review-skeleton{

    background:#fff;

    border:1px solid #edf2f7;

    border-radius:14px;

    overflow:hidden;

}

.review-head{

    display:flex;

    justify-content:space-between;

    padding:18px 22px;

}

.sk-stars{

    width:120px;

    height:18px;

    border-radius:8px;

    background:#eef2f7;

}

.sk-author{

    width:180px;

    height:18px;

    border-radius:8px;

    background:#eef2f7;

}

.sk-body{

    height:65px;

    margin:18px 22px 22px;

    border-radius:10px;

    background:#eef2f7;

}

.shimmer{

    position:relative;

    overflow:hidden;

}

.shimmer::after{

    content:"";

    position:absolute;

    top:0;

    left:-150%;

    width:150%;

    height:100%;

    background:linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,.8),
        transparent
    );

    animation:reviewShimmer 1.2s infinite;

}

@keyframes reviewShimmer{

    100%{

        left:150%;

    }

}

/*==================================================
    Product Galleries
==================================================*/

.gallery-card{

    background:#fff;

    border:1px solid #edf2f7;

    border-radius:18px;

    overflow:hidden;

    transition:.3s;

    box-shadow:0 8px 25px rgba(15,23,42,.05);

}

.gallery-card:hover{

    transform:translateY(-6px);

    box-shadow:0 18px 40px rgba(15,23,42,.12);

}

.gallery-link{

    display:block;

    position:relative;

    overflow:hidden;

}

.gallery-image{

    width:100%;

    aspect-ratio:16/10;

    object-fit:cover;

    transition:.35s;

}

.gallery-card:hover .gallery-image{

    transform:scale(1.05);

}

.gallery-overlay{

    position:absolute;

    inset:0;

    display:flex;

    align-items:center;

    justify-content:center;

    background:rgba(15,23,42,.45);

    opacity:0;

    transition:.3s;

}

.gallery-card:hover .gallery-overlay{

    opacity:1;

}

.gallery-overlay i{

    font-size:34px;

    color:#fff;

}

.gallery-title{

    padding:16px;

    text-align:center;

    font-weight:600;

    color:#0f172a;

}

.empty-gallery{

    padding:70px 20px;

    text-align:center;

}

.empty-gallery i{

    font-size:54px;

    color:#cbd5e1;

    margin-bottom:15px;

    display:block;

}

.empty-gallery h4{

    margin-bottom:10px;

    font-weight:700;

}

.empty-gallery p{

    color:#64748b;

}