.coupon-layout{

max-width:1100px;
margin:40px auto;

display:grid;
grid-template-columns:2fr 1fr;
gap:30px;

}

.coupon-card{

display:grid;
grid-template-columns:120px 1fr 180px;
align-items:center;
background:rgba(236,215,215,0.85)!important;
border:8px solid #1e293b;
padding:20px;
margin-bottom:15px;
box-shadow:0 2px 6px rgba(0,0,0,0.08);

}

.coupon-value{

font-size:28px;
font-weight:700;
color:#9f1537;

}

.coupon-btn{

background:#9f1537;
color:#fff;

padding:12px 18px;
border-radius:6px;

border:none;
cursor:pointer;

font-weight:600;

}

.coupon-btn:hover{

background:#7c0f2b;

}


/* SIDEBAR */

.coupon-sidebar{

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

}

.sidebar-box{

background:#1e293b;
color:#fff;

padding:20px;

border-radius:8px;

position:relative;

}

.sidebar-box h3{

margin-bottom:15px;
color:#fff;

}

.sidebar-item{

padding:10px 0;
border-bottom:1px solid rgba(255,255,255,0.2);

}

.sidebar-item:last-child{

border-bottom:none;

}

.sidebar-item strong{

color:#fff;

}

.sidebar-box::after{

content:"";
position:absolute;

top:40px;
right:15px;

width:90px;
height:90px;

background:url("/wp-content/uploads/2026/03/deals-icon.png");
background-size:contain;
background-repeat:no-repeat;

opacity:0.9;

}


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

@media (max-width:1024px){

.coupon-layout{

grid-template-columns:1fr;
gap:25px;

}

.coupon-sidebar{
order:2;
}

.coupon-list{
order:1;
}

.coupon-card{

grid-template-columns:100px 1fr 150px;

padding:18px;

}

.sidebar-box::after{

width:70px;
height:70px;
top:30px;

}

}


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

@media (max-width:768px){

.coupon-layout{

margin:20px;
gap:20px;

}

.coupon-card{

grid-template-columns:90px 1fr;
grid-template-rows:auto auto;

gap:12px;

}

.coupon-right{

grid-column:1 / -1;

display:flex;
justify-content:flex-end;

}

.coupon-value{

font-size:22px;

}

.coupon-btn{

padding:10px 14px;

}

.sidebar-box{

padding:18px;

}

}


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

@media (max-width:480px){

.coupon-card{

grid-template-columns:1fr;

text-align:left;

gap:10px;

}

.coupon-left{
margin-bottom:6px;
}

.coupon-right{

justify-content:flex-start;

}

.coupon-btn{

width:100%;

}

.sidebar-box::after{

display:none;

}

}