/* ======================================
   PRODUCT PAGE Background
====================================== */

.site-wrapper{
    background:#0b0b0b;
    min-height:100vh;
}

.site-main{
    background:#0b0b0b;
}

#block-jallikattu-theme-content{
    background:#0b0b0b;
}

html,
body{
    overflow-x:hidden;
}

/* ======================================
   PRODUCT DETAILS PAGE
====================================== */

/*.product-details-page{
    width:100%;
    max-width:1320px;
    margin:50px auto;
    padding:0 20px;
    box-sizing:border-box;
    display:grid;
    grid-template-columns:55% 45%;
    gap:70px;
    align-items:start;
}*/

.product-details-page{
    background:#0b0b0b;
    color:#fff;
    width:100%;
    max-width:1320px;
    margin:60px auto;
    padding:40px 20px;
    display:grid;
    grid-template-columns:55% 45%;
    gap:60px;
    box-sizing:border-box;
}

.product-gallery{
    min-width:0;
    position:sticky;
    top:120px;
}

.product-information{
    display:flex;
    flex-direction:column;
}

/* ======================================
   Breadcrumbs
====================================== */

.product-breadcrumb{
    color:#9a9a9a;
    font-size:14px;
    margin-bottom:20px;
}

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

.product-title{
    margin-bottom:15px;
    font-family:var(--font-heading);

    font-size:42px;
}

.product-title h1,
.product-title .field,
.product-title span{
    font-size:42px;
    font-weight:700;
    line-height:1.2;
    color:#fff;
    font-family:var(--font-heading);

    font-size:42px;
}

/* ==========================================
   PRODUCT GALLERY
========================================== */

.product-gallery{

    display:grid;
    grid-template-columns:90px 1fr;
    gap:25px;
    align-items:start;

}

.gallery-thumbnails{

    display:flex;
    flex-direction:column;
    gap:15px;

}

.thumbnail-image{

    width:80px;
    height:80px;

    object-fit:cover;

    border:2px solid #333;

    border-radius:10px;

    cursor:pointer;

    transition:.3s;

    background:#111;

}

.thumbnail-image:hover{

    border-color:#d4af37;

    transform:scale(1.05);

}

.gallery-main{

    background:#111;

    border:1px solid #2d2d2d;

    border-radius:20px;

    padding:30px;

    display:flex;

    justify-content:center;

    align-items:center;

    min-height:650px;

}

.gallery-main img{

    width:100%;

    max-width:500px;

    object-fit:contain;

}

/* ======================================
   Rating
====================================== */

.product-rating{
    display:flex;
    align-items:center;
    gap:10px;
    color:#f5c542;
    font-size:18px;
    margin-bottom:25px;
}

.product-rating span{
    color:#fff;
    font-weight:600;
}

.product-rating small{
    color:#8d8d8d;
}

/* ======================================
   Price
====================================== */

.product-price{
    display:flex;
    align-items:center;
    gap:20px;
    margin-bottom:35px;
}

.product-price .commerce-price{
    font-size:40px;
    font-weight:700;
    color:#f5c542;
}

.list-price{
    text-decoration:line-through;
    color:#777;
    font-size:22px;
}

.discount-badge{
    background:#d32f2f;
    color:#fff;
    padding:6px 14px;
    border-radius:50px;
    font-size:13px;
    font-weight:600;
}


/* ======================================
   Brand & Category
====================================== */

.product-meta{
    display:flex;
    gap:50px;
    margin-bottom:35px;
}

.product-meta strong{
    display:block;
    margin-bottom:8px;
    color:#fff;
}

.product-meta .field{
    color:#c9c9c9;
}


/* ======================================
   Description
====================================== */

.product-short-description{
    color:#bdbdbd;
    line-height:1.9;
    margin-bottom:40px;
}

/* ======================================
   Add to Cart Section
====================================== */

.product-cart-section{
    border-top:1px solid #2f2f2f;
    padding-top:35px;
}

#edit-actions{

    width:100%;

}

.button--add-to-cart{

    width:100%;

}


/* ======================================
   Benefits
====================================== */

.product-benefits{
    margin-top:40px;
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:15px;
}

.product-benefits div{
    background:#1b1b1b;
    border:1px solid #2d2d2d;
    border-radius:12px;
    padding:15px 18px;
    color:#d7d7d7;
    transition:.3s;
}

.product-benefits div:hover{
    border-color:#f5c542;
}

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

.gallery-main img{
    width:100%;
    max-width:100%;
    height:auto;
    display:block;
    border-radius:20px;
}

/* ======================================
   Variation dropdowns
====================================== */

.attribute-widgets{

    display:flex;
    gap:20px;
    flex-wrap:wrap;

}

.attribute-widgets .form-item{

    min-width:180px;
    flex:1;

}

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

@media(max-width:991px){

.product-details-page{
    grid-template-columns:1fr;
    gap:40px;
}

.product-gallery{
    position:static;
}

.product-title h1,
.product-title .field,
.product-title span{
    font-size:32px;
}

.product-price .commerce-price{
    font-size:32px;
}

.product-meta{
    flex-direction:column;
    gap:20px;
}

.product-benefits{
    grid-template-columns:1fr;
}

}

/* ===========================
   PRODUCT INFO
=========================== */

.product-info{

    display:flex;
    flex-direction:column;
    gap:22px;

}

.product-brand{

    color:#d4af37;

    font-size:15px;

    font-weight:600;

    text-transform:uppercase;

    letter-spacing:2px;

}

.product-title{

    font-size:42px;

    font-weight:700;

    line-height:1.2;

    color:#fff;

    margin:0;

}

.product-rating{

    color:#ffc107;

    font-size:18px;

}

.product-rating span{

    color:#9a9a9a;

    font-size:15px;

    margin-left:10px;

}

.product-price{

    display:flex;

    align-items:center;

    gap:18px;

}

.sale-price{

    font-family:var(--font-menu);

    font-size:34px;

    font-weight:700;

    color:#fff;

}

.original-price{

    color:#777;

    text-decoration:line-through;

    font-size:22px;

}

.discount{

    background:#d4af37;

    color:#000;

    padding:6px 14px;

    border-radius:40px;

    font-weight:700;

}

.product-meta{

    display:flex;

    flex-direction:column;

    gap:10px;

    padding:20px;

    background:#141414;

    border-radius:12px;

}

.product-description{

    color:#d2d2d2;

    line-height:1.8;

}

.in-stock{

    color:#2ecc71;

    font-weight:600;

}

/*================================================
PRODUCT VARIATIONS
================================================*/

.purchase-section{

    display:flex;
    flex-direction:column;
    gap:25px;

}

.attribute-widgets{

    display:flex;
    flex-direction:column;
    gap:25px;

}

.attribute-widgets .form-item{

    margin:0;

}

.attribute-widgets label{

    display:block;

    color:#ffffff;

    font-size:15px;

    font-weight:600;

    margin-bottom:12px;

}

.attribute-widgets select{

    width:100%;

    height:55px;

    padding:0 18px;

    border-radius:12px;

    border:1px solid #333;

    background:#161616;

    color:#fff;

    font-size:16px;

    transition:.3s;

    cursor:pointer;

}

.attribute-widgets select:hover{

    border-color:#d4af37;

}

.attribute-widgets select:focus{

    outline:none;

    border-color:#d4af37;

    box-shadow:0 0 0 3px rgba(212,175,55,.15);

}

/* ======================================
   Add to Cart button
====================================== */

.form-actions{

    margin-top:30px;

}

.button--add-to-cart{

    width:100%;

    height:60px;

    border:none;

    border-radius:12px;

    background:#d4af37;

    color:#111;

    font-size:18px;

    font-weight:700;

    cursor:pointer;

    transition:.3s;

}

.button--add-to-cart:hover{

    background:#e7c760;

    transform:translateY(-2px);

}

/* ======================================
   Buy now wrapper
====================================== */

.buy-now-wrapper{

    margin-top:18px;

}

.buy-now-btn{

    width:100%;

    height:60px;

    border:2px solid #d4af37;

    background:transparent;

    color:#d4af37;

    border-radius:12px;

    font-size:18px;

    font-weight:700;

    cursor:pointer;

    transition:.3s;

}

.buy-now-btn:hover{

    background:#d4af37;

    color:#111;

}

/* ======================================
   Product feature
====================================== */

.product-features{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:18px;

    margin-top:35px;

}

.product-features div{

    display:flex;

    align-items:center;

    gap:12px;

    background:#141414;

    border:1px solid #2a2a2a;

    padding:18px;

    border-radius:12px;

}

.product-features i{

    color:#d4af37;

    font-size:22px;

}

/*=========================================
VARIATION BUTTONS
=========================================*/



/*=====================================
QUANTITY
=====================================*/

.quantity-wrapper{

    margin-top:30px;

}

.quantity-wrapper label{

    display:block;

    margin-bottom:15px;

    font-weight:600;

    color:#fff;

}

.quantity-box{

    width:180px;

    height:55px;

    display:flex;

    align-items:center;

    justify-content:space-between;

    border:1px solid #333;

    border-radius:12px;

    background:#161616;

    overflow:hidden;

}

.quantity-box button{

    width:55px;

    height:55px;

    border:none;

    background:none;

    color:#fff;

    cursor:pointer;

    font-size:18px;

    transition:.3s;

}

.quantity-box button:hover{

    background:#d4af37;

    color:#111;

}

.qty-value{

    font-size:18px;

    font-weight:700;

    color:#fff;

}