#cwp-wrapper{

margin:20px 0;

}

.cwp-title{

font-size:22px;

font-weight:700;

margin-bottom:15px;

}

.cwp-grid{

display:flex;

gap:15px;

flex-wrap:wrap;

}

.cwp-card{

position:relative;

display:block;

width:230px;

cursor:pointer;

border:2px solid #ddd;

border-radius:12px;

background:#fff;

transition:.3s;

overflow:hidden;

}

.cwp-card:hover{

border-color:#ff6b00;

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

transform:translateY(-2px);

}

.cwp-card input{

position:absolute;

opacity:0;

pointer-events:none;

}

.cwp-card.cwp-active{

border-color:#16a34a;

background:#f0fff4;

}

.cwp-card-body{

padding:18px;

}

.cwp-header{

display:flex;

align-items:center;

gap:10px;

margin-bottom:12px;

}

.cwp-flag{

font-size:26px;

}

.cwp-name{

font-size:18px;

font-weight:700;

}

.cwp-price{

font-size:26px;

font-weight:700;

color:#ff6b00;

margin-bottom:8px;

}

.cwp-stock{

font-size:14px;

color:#666;

}

.cwp-live-price{

margin-top:20px;

padding:18px;

border-radius:12px;

background:#eefaf2;

border:2px solid #16a34a;

text-align:center;

}

.cwp-live-label{

font-size:13px;

color:#666;

margin-bottom:6px;

}

.cwp-live-value{

font-size:30px;

font-weight:700;

color:#16a34a;

}

@media(max-width:768px){

.cwp-grid{

display:block;

}

.cwp-card{

width:100%;

margin-bottom:15px;

}

}