/*==========================
SINGLE PRODUCT
==========================*/

.jasani-single{

background:#0d0d0d;

color:#fff;

padding:70px 0;

}

.jasani-container{

max-width:1350px;

margin:auto;

display:grid;

grid-template-columns:520px 1fr;

gap:70px;

padding:0 25px;

align-items:flex-start;

}

/*==========================
LEFT
==========================*/

.gallery-main{

background:#161616;

border:1px solid #262626;

overflow:hidden;

}

.gallery-main img{

width:100%;

display:block;

aspect-ratio:1/1;

object-fit:cover;

transition:.4s;

}

.gallery-main:hover img{

transform:scale(1.04);

}

.gallery-thumbs{

display:flex;

gap:15px;

margin-top:20px;

flex-wrap:wrap;

}

.thumb{

width:90px;

height:90px;

cursor:pointer;

border:2px solid transparent;

overflow:hidden;

background:#161616;

transition:.25s;

}

.thumb.active{

border-color:#fff;

}

.thumb img{

width:100%;

height:100%;

object-fit:cover;

display:block;

}

/*==========================
RIGHT
==========================*/

.product-title{

font-size:46px;

font-weight:800;

line-height:1.1;

margin:0;

text-transform:uppercase;

}

.product-price{

font-size:34px;

font-weight:700;

margin:22px 0;

}

.product-meta{

display:flex;

gap:35px;

flex-wrap:wrap;

margin-bottom:30px;

font-size:15px;

color:#bdbdbd;

}

.product-meta strong{

color:#fff;

}

.product-description{

line-height:1.8;

color:#cfcfcf;

font-size:15px;

margin-bottom:35px;

}

/*==========================
STATUS
==========================*/

.instock{

color:#61ff6b;

font-weight:700;

}

.outstock{

color:#ff5d5d;

font-weight:700;

}

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

.variation-group{

margin-bottom:30px;

}

.variation-group label{

display:block;

font-size:16px;

font-weight:700;

margin-bottom:14px;

}

.color-options,

.size-options{

display:flex;

gap:12px;

flex-wrap:wrap;

}

.color-btn,

.size-btn{

background:#151515;

border:1px solid #555;

color:#fff;

padding:12px 18px;

cursor:pointer;

transition:.25s;

font-size:14px;

}

.color-btn:hover,

.size-btn:hover,

.color-btn.active,

.size-btn.active{

background:#fff;

color:#111;

}

/*==========================
QTY
==========================*/

.qty-wrap{

display:flex;

align-items:center;

margin-top:20px;

margin-bottom:35px;

width:170px;

border:1px solid #444;

}

.qty-wrap button{

width:50px;

height:50px;

background:#111;

border:none;

color:#fff;

font-size:22px;

cursor:pointer;

}

.qty-wrap input{

width:70px;

height:50px;

background:#111;

border:none;

text-align:center;

color:#fff;

font-size:18px;

outline:none;

}

/*==========================
BUTTON
==========================*/

.add-cart-btn{

height:58px;

padding:0 45px;

background:#fff;

color:#111;

border:none;

cursor:pointer;

font-size:16px;

font-weight:700;

transition:.3s;

}

.add-cart-btn:hover{

background:#d6d6d6;

}


.variation-group select{

width:100%;

height:50px;

padding:0 15px;

background:#161616;

color:#fff;

border:1px solid #444;

font-size:15px;

outline:none;

cursor:pointer;

}

.variation-group select:focus{

border-color:#fff;

}

.variation-group option{

background:#161616;

color:#fff;

}

/*==========================
RESPONSIVE
==========================*/

@media(max-width:1100px){

.jasani-container{

grid-template-columns:1fr;

}

.product-title{

font-size:38px;

}

}

@media(max-width:768px){

.product-title{

font-size:30px;

}

.product-price{

font-size:26px;

}

.gallery-thumbs{

justify-content:center;

}

}